在AngularJS的输入字段上应用数字过滤器

Question

我们如何在输入字段上应用数字过滤器？我在非输入字段上显示效果很好。但是，当我在输入字段上设置过滤器时，出现错误。

<input type="number" name="input" ng-model="value2 | number:2" 
      min="0" max="99" size="20"> 

Error: [ngModel:numfmt] http://errors.angularjs.org/1.3.8/ngModel/numfmt?p0=98.77 at Error (native) at http://ajax.googleapis.com/ajax/libs/angularjs/1.3.8/angular.min.js:6:416

下面是用于测试的普拉克。 number format

Answer 1

您不能将filter应用于ng-model。

具体详细信息请参见这个答案（未标记为的答案）： https://stackoverflow.com/a/14425022/1452497

简短而亲切：

...the intention of AngularJS inputs and the ngModel directive is that invalid input should never end up in the model. The model should be always valid.

考虑也该表达内的ng-model需求可以从解析器中分配。

ng-model="testA"最终分解为：testA = some-input-value

这将无法正常工作：testA | number:2 = some-input-value

你应该使用formatter或parser这（在视图之外）。

Answer 2

This error: 
Error: [ngModel:numfmt] http://errors.angularjs.org/1.3.5/ngModel/numfmt?p0=1 
check your model: don't using $scope.mymodel = '1'; 
to use $scope.mymodel = 1; 

该指令仅验证输入上的数字。

angularMainModule.directive('onlyNumbers', function() { 
    return function(scope, element, attrs) { 
     var keyCode = [8,9,37,39,48,49,50,51,52,53,54,55,56,57, 
        96,97,98,99,100,101,102,103,104,105,110]; 
     element.bind("keydown", function(event) { 
      if($.inArray(event.which,keyCode) == -1) { 
       scope.$apply(function(){ 
        scope.$eval(attrs.onlyNumbers); 
        event.preventDefault();`enter code here` 
       }); 
       event.preventDefault(); 
      } 
     }); 
    }; 
});