AngularJS將輸入限制爲數字不起作用

Question

我的html頁面上有一個輸入框，將數據綁定到ng模型。我使用指令將輸入字段限制爲數字。我無法使用默認的HTML5限制，例如type =「number」。我遇到的問題是，如果輸入非數字字符兩次，例如按123，然後兩次k，則k被添加到123，導致123k。但是，當我按另一個鍵時，k被指令刪除。

有人可以幫助我走出來修復該字母出現問題，如果您按相同的鍵兩次

該指令使用：

angular.module('app'). 
directive('onlyDigits', function() { 

return { 
    restrict: 'A', 
    require: '?ngModel', 
    link: function (scope, element, attrs, ngModel) { 
     if (!ngModel) return; 
     ngModel.$parsers.unshift(function (inputValue) { 
      var digits = inputValue.split('').filter(function (s) { return (!isNaN(s) && s != ' '); }).join(''); 
      ngModel.$viewValue = digits; 
      ngModel.$render(); 
      return digits; 
     }); 
    } 
}; 

}）;

Answer 1

這就是我們只使用在一個指令，以實現數字：

directives.directive('numbersOnly', function() { 
    'use strict'; 
    return { 
     require: 'ngModel', 
     link: function (scope, element, attrs, modelCtrl) { 
      modelCtrl.$parsers.push(function (inputValue) { 
       if (inputValue === undefined) { 
        return ''; 
       } 
       var transformedInput = inputValue.replace(/[^0-9]/g, ''); 
       if (transformedInput !== inputValue) { 
        modelCtrl.$setViewValue(transformedInput); 
        modelCtrl.$render(); 
       } 
       return transformedInput; 
      }); 
     } 
    }; 
});