Question

我们如何在输入字段上应用数字过滤器？我在非输入字段上显示工作正常。但是，当我在输入字段上设置过滤器时，我收到错误。

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

错误：[ngModel：numfmt] http://errors.angularjs.org/1.3.8/ngModel/numfmt?p0=98.77 在错误（本机）在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

短而甜蜜：

...... AngularJS输入和ngModel的意图指令是无效输入永远不会在模型中结束。该模型应始终有效。

还要考虑ng-model内的表达式需要来自解析器 assignable 。

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();
            }
        });
    };
});

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

2 个答案: