AngularJS currency 过滤器

实例

将数字显示为货币格式:

  1. <!DOCTYPE html>
  2. <html>
  3. <script src="https://cdn.bootcdn.net/ajax/libs/angular.js/1.8.2/angular.min.js"></script>
  4. <body>
  5. <div ng-app="myApp" ng-controller="costCtrl">
  6. <p>Price = {{ price | currency }}</p>
  7. </div>
  8. <script>
  9. var app = angular.module('myApp', []);
  10. app.controller('costCtrl', function($scope) {
  11. $scope.price = 9.99;
  12. });
  13. </script>
  14. <p>货币过滤器将数字格式化为货币格式。</p>
  15. </body>
  16. </html>

定义与用法

currency 过滤器将数字格式化为货币格式。

默认情况下,将使用区域货币格式。


语法

  1. {{ number | currency : symbol : fractionsize }}

参数值

描述
symbol可选。要显示的货币符号。该符号可以是任何字符或文本
fractionsize可选。小数位数

更多实例

实例

以挪威货币格式显示价格:

  1. <!DOCTYPE html>
  2. <html>
  3. <script src="https://cdn.bootcdn.net/ajax/libs/angular.js/1.8.2/angular.min.js"></script>
  4. <body>
  5. <div ng-app="myApp" ng-controller="costCtrl">
  6. <p>Price = {{ price | currency : "NOK"}}</p>
  7. </div>
  8. <script>
  9. var app = angular.module('myApp', []);
  10. app.controller('costCtrl', function($scope) {
  11. $scope.price = 9.99;
  12. });
  13. </script>
  14. <p>可以通过设置 symbol 参数来更改货币符号。</p>
  15. </body>
  16. </html>
实例

以三位小数显示价格:

  1. <!DOCTYPE html>
  2. <html>
  3. <script src="https://cdn.bootcdn.net/ajax/libs/angular.js/1.8.2/angular.min.js"></script>
  4. <body>
  5. <div ng-app="myApp" ng-controller="costCtrl">
  6. <p>Price = {{ price | currency : "NOK" : 3}}</p>
  7. </div>
  8. <script>
  9. var app = angular.module('myApp', []);
  10. app.controller('costCtrl', function($scope) {
  11. $scope.price = 9.99;
  12. });
  13. </script>
  14. <p>通过设置 fractionsize 参数,可以更改小数位数。</p>
  15. </body>
  16. </html>

相关页面

AngularJS 教程: Angular 过滤器

分类导航