Question

我想创建只写小数位数的指令。我有这段代码：

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

我可以用小数位写数字，但也可以写其他字符。感谢您的建议

Answer 1

angular.directive('decimalPlaces',function(){
  return {
      link:function(scope,ele,attrs){
          ele.bind('keypress',function(e){
              var newVal=$(this).val()+(e.charCode!==0?String.fromCharCode(e.charCode):'');
              if($(this).val().search(/(.*)\.[0-9][0-9]/)===0 && newVal.length>$(this).val().length){
                  e.preventDefault();
              }
          });
      }
  };
});


<input  type="number" step="0.01" ng-model='somemodel' decimal-places>

您也可以使用https://www.npmjs.com/package/angular-input-masks。

希望这会有所帮助。

Answer 2

使用ng-pattern指令，设置正则表达式。

<input type="text" ng-model="onlyNumbers" ng-pattern="/^[0-9]+\.?[0-9]*$/">

AngularJS - 仅用于带小数位的数字的指令

2 个答案: