举例简介AngularJS的内部语言环境

 更新时间:2015年06月17日 11:42:01   投稿:goldensun  
这篇文章主要介绍了AngularJS的内部语言环境,展示不同语言环境下对货币或是日期等文本方面所产生的影响,需要的朋友可以参考下

GPT4.0+Midjourney绘画+国内大模型 会员永久免费使用!
如果你想靠AI翻身,你先需要一个靠谱的工具!

 AngularJS支持内置的国际化三种类型的过滤器货币,日期和数字。只需要根据国家的区域纳入相应的JS。默认情况下它处理浏览器的语言环境。例如,要使用丹麦语的语言环境,使用下面的脚本

1
<script src="https://code.angularjs.org/1.2.5/i18n/angular-locale_da-dk.js"></script>

使用丹麦语的语言环境实例
testAngularJS.html

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
<html>
<head>
 <title>Angular JS Forms</title>
</head>
<body>
 <h2>AngularJS Sample Application</h2>
 <div ng-app="mainApp" ng-controller="StudentController">
  {{fees | currency }} <br/><br/>
  {{admissiondate | date }} <br/><br/>
  {{rollno | number }}
 </div>
 <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.min.js"></script>
 <script src="https://code.angularjs.org/1.2.5/i18n/angular-locale_da-dk.js"></script>
 <script>
  var mainApp = angular.module("mainApp", []);
   
  mainApp.controller('StudentController', function($scope) {
   $scope.fees = 100;
 $scope.admissiondate = new Date();
   $scope.rollno = 123.45;
  });
   
 </script>
</body>
</html>

结果

在Web浏览器打开textAngularJS.html。看到结果如下。

2015617114029826.jpg (560×240)

 使用浏览器的语言环境示例
testAngularJS.html

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
<html>
<head>
 <title>Angular JS Forms</title>
</head>
<body>
 <h2>AngularJS Sample Application</h2>
 <div ng-app="mainApp" ng-controller="StudentController">
  {{fees | currency }} <br/><br/>
  {{admissiondate | date }} <br/><br/>
  {{rollno | number }}
 </div>
 <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.min.js"></script>
 <!-- <script src="https://code.angularjs.org/1.2.5/i18n/angular-locale_da-dk.js"></script> -->
 <script>
  var mainApp = angular.module("mainApp", []);
   
  mainApp.controller('StudentController', function($scope) {
   $scope.fees = 100;
 $scope.admissiondate = new Date();
   $scope.rollno = 123.45;
  });
   
 </script>
</body>
</html>

结果

在Web浏览器打开textAngularJS.html。看到结果如下。

2015617114048791.jpg (560×240)

蓄力AI

微信公众号搜索 “ 脚本之家 ” ,选择关注

程序猿的那些事、送书等活动等着你

相关文章

  • 在Angular项目使用socket.io实现通信的方法

    在Angular项目使用socket.io实现通信的方法

    这篇文章主要介绍了在Angular项目使用socket.io实现通信的方法,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2021-01-01
  • 深入理解Angular2 模板语法

    深入理解Angular2 模板语法

    这篇文章主要介绍了Angular2 模板语法的相关资料,非常不错,感兴趣的朋友一起学习吧,需要的朋友可以参考下
    2016-08-08
  • Angular.JS通过指令操作DOM的方法

    Angular.JS通过指令操作DOM的方法

    这篇文章主要给大家介绍了Angular.JS通过指令操作DOM的方法,文中给出了详细的介绍和示例代码,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面来一起看看吧。
    2017-05-05
  • AngularJS 过滤器的简单实例

    AngularJS 过滤器的简单实例

    本文主要介绍AngularJS 过滤器,这里提供详细了AngularJS 过滤器详细资料,并提供简单实例,有需要的朋友可以参考下
    2016-07-07
  • AngularJS入门教程之Hello World!

    AngularJS入门教程之Hello World!

    这篇文章主要介绍了AngularJS入门教程之Hello World!,本文用经典的应用程序“Hello World!”来讲解AngularJS,要的朋友可以参考下
    2014-12-12
  • AngularJs基本特性解析(一)

    AngularJs基本特性解析(一)

    angularjs是javascript的一个框架,通过script标签添加到网页中。这篇文章主要介绍了AngularJs基本特性解析(一)的相关资料,需要的朋友可以参考下
    2016-07-07
  • angular8.5集成TinyMce5的使用和详细配置(推荐)

    angular8.5集成TinyMce5的使用和详细配置(推荐)

    这篇文章主要介绍了angular8.5集成TinyMce5的使用和详细配置,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2020-11-11
  • Angular实现图片裁剪工具ngImgCrop实践

    Angular实现图片裁剪工具ngImgCrop实践

    本篇文章主要介绍了Angular实现图片裁剪工具ngImgCrop实践,具有一定的参考价值,有兴趣的可以了解一下
    2017-08-08
  • Angular2学习笔记之数据绑定的示例代码

    Angular2学习笔记之数据绑定的示例代码

    本篇文章主要介绍了Angular2学习笔记之数据绑定的示例代码,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-01-01
  • Angular 4根据组件名称动态创建出组件的方法教程

    Angular 4根据组件名称动态创建出组件的方法教程

    组件是我们在学习angular中必不可少的一部分,下面这篇文章主要给大家介绍了关于Angular 4如何根据组件名称动态创建出组件的相关资料,文中通过图文与示例代码介绍的非常详细,需要的朋友可以参考借鉴,下面来一起看看吧。
    2017-11-11

最新评论