Angularjs输入框中的货币格式

时间:2014-05-29 07:06:06

标签: javascript angularjs

嗨!我有以下输入框:

<div ng-repeat="item in items"
    <input ng-model="item.cost" />
</div>

我想弄清楚如何申请&#34;货币&#34;过滤到输入框。因此,当显示值时,它会显示$ sign和正确的货币符号。我可以使用{{item.cost | currency }}执行span,但我需要可编辑的框来根据需要更改值。 请告诉我如何将货币过滤器应用于输入框。 谢谢

1 个答案:

答案 0 :(得分:2)

试试这个

.directive('currencyFormatter', ['$filter', function ($filter) {


            formatter = function (num) {
              return $filter('currency')(num);
            };

        return {
          restrict: 'A',
          require: 'ngModel',
          link: function (scope, element, attr, ngModel) {
            ngModel.$parsers.push(function (str) {
             return str ? Number(str) : '';
            });
            ngModel.$formatters.push(formatter);

            element.bind('blur', function() {
              element.val(formatter(ngModel.$modelValue))
            });
            element.bind('focus', function () {
              element.val(ngModel.$modelValue);
            });
          }
        };
      }]);

和html

<div ng-repeat="item in items">
    <input ng-model="item.cost" currency-formatter/>
  </div>
 <div ng-repeat="item in items">
    {{item.cost}}
  </div>