指令不适用于输入类型=使用angularjs的数字

时间:2016-02-06 11:31:42

标签: html angularjs ionic-framework

我有一个输入类型=数字字段。它允许整数和十进制数。但我只需要输入整数。我创建了一个指令,它只适用于输入类型=文本,不工作输入类型=数字。原因是我需要一个移动数字键盘。

以下代码仅供参考,

Angularjs:

.directive('numbersOnly', function () {
return {
    require: 'ngModel',
    link: function (scope, element, attr, ngModelCtrl) {
        function fromUser(text) {
            if (text) {
                var transformedInput = text.replace(/[^0-9-]/g, '');
                if (transformedInput !== text) {
                    ngModelCtrl.$setViewValue(transformedInput);
                    ngModelCtrl.$render();
                }
                return transformedInput;
            }
            return '';
        }
        ngModelCtrl.$parsers.push(fromUser);
    }
};
})

HTML:

  <input type="number" ng-model="points" numbers-only  required>

欢迎任何建议

1 个答案:

答案 0 :(得分:1)

试试这个

HTML

<input type="text"  ng-model="myText" name="inputName" numbers-only>

指令

myApp.directive('numbersOnly', function(){
     return {
         require: 'ngModel',
         link: function(scope, element, attrs, modelCtrl) {
             modelCtrl.$parsers.push(function (inputValue) {
                 var transformedInput = inputValue ? inputValue.replace(/[^\d.-]/g,'').replace('.','') : null;

                 if (transformedInput != inputValue) {
                   modelCtrl.$setViewValue(transformedInput);
                   modelCtrl.$render();
                 }

                 return transformedInput;
             });
          }
      };
});

https://jsfiddle.net/vorant/Lzw0yoma/