Question

当用户键入一个数字时，我有一个输入类型的数字，它应该以印度格式显示

Example:  500000 should be displayed as 50,000

不使用javascript我怎么能在html本身使用印度格式。

我已经使用过滤器来显示印度格式的值，这对于查看数据很有效但我想在输入期间也这样做但是当我尝试在模型中使用相同的过滤器时它没有; t显示任何东西。

HTML：

<input ng-if="vm.farmer.type === 'Advance'"
        type="number" maxlength="9" placeholder="{{'advamount_message' | translate}}" step=".01"
        ng-model="vm.advance.amount_out" ng-change="vm.fillStarted()"
        next-focus id="field1"
        field-to-validate="yes"
        field-value="{{vm.advance.amount_out}}" field-validation-type="num" field-name="{{'vamount_message' | translate}}">

用于查看的过滤器：

.filter('INR', function () {
return function (input) {
  if (!isNaN(input)) {
    //var currencySymbol = '₹';
    /*var result = input.toString().split('.');
    var lastThree = result[0].substring(result[0].length - 3);
    var otherNumbers = result[0].substring(0, result[0].length - 3);
    if (otherNumbers !== '') {
      lastThree = ',' + lastThree;
    }
    var output = otherNumbers.replace(/\B(?=(\d{2})+(?!\d))/g, ',') + lastThree;
    // var output = otherNumbers.replace(/(\d)(?=(\d\d)+\d$)/g, ',') + lastThree;
    if (result.length > 1) {
      output += '.' + result[1];
    }
    return output;*/
    var negative = input < 0;
    var str = negative ? String(-input) : String(input);
    var arr = [];
    var i = str.indexOf('.');
    if (i === -1) {
      i = str.length;
    } else {
      for (var j = str.length - 1; j > i; j--) {
        arr.push(str[j]);
      }
      arr.push('.');
    }
    i--;
    for (var n = 0; i >= 0; i--, n++) {
      if (n > 2 && (n % 2 === 1)) {
        arr.push(',');
      }
      arr.push(str[i]);
    }
    if (negative) {
      arr.push('-');
    }
    return arr.reverse().join('');
  }
};

在视图中：

{{vm.farmer.balance | INR}}

Answer 1

试试此过滤器

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta charset="utf-8" />
</head>
<body>
    <div ng-app="app" ng-controller="ctrl">
        {{price | INR}}
    </div>

    <script src="../lib/angular.js"></script>
    <script>
        var app = angular.module('app', []);
        app.filter('INR', function () {
            return function (input) {
                var length = input.length;
                if(input.length < 3)
                {
                    return input;
                }
                else {
                    var input = input.split(''); //convert it to string and split it into the chars
                    var output = input[length - 3] + input[length - 2] + input[length - 1];
                    var j = 2;
                    for(i=input.length;i--;i>1)
                    {

                        if(j>1)
                        {
                            output = ',' + output;
                            j = 0;
                        }
                        else {

                        }
                        if (i != 0)
                            {
                        output = input[i - 1] + output;
                        j++;
                        }
                    }
                    return output;
                }
            }
        });
        app.controller('ctrl', function ($scope) {
            $scope.price = '4665987565';
        });

    </script>

</body>
</html>

Answer 2

you can use this :-
In HTML Template Binding
{{ currency_expression | currency : symbol : fractionSize}}

In JavaScript
$filter('currency')(amount, symbol, fractionSize)

<script>
  angular.module('currencyExample', [])
    .controller('ExampleController', ['$scope', function($scope) {
      $scope.amount = 1234.56;
    }]);
</script>
<div ng-controller="ExampleController">
  <input type="number" ng-model="amount" aria-label="amount"> <br>
  default currency symbol ($): <span id="currency-default">{{amount | currency}}</span><br>
  custom currency identifier (USD$): <span id="currency-custom">{{amount | currency:"USD$"}}</span><br>
  no fractions (0): <span id="currency-no-fractions">{{amount | currency:"USD$":0}}</span>
</div>

如何在html中以印度格式显示数字

2 个答案: