我试图创建一个只接受数字或十进制数字的指令,具体取决于我在输入中插入的属性,我遇到的问题是小数位声明。

例:
如果用户只有此输入的内容接受int数,则可能是

<input only-number type-num="int">


如果用户只想输入小数位,

<input only-number type-num="decimal" maxDecimalPoints="2">


但是现在我必须$ observe typeNum和MaxDecimalPoints,我可以将$ observe彼此嵌套吗?我该如何完成?

这是我的指令:

angular.module('app')
    .directive('onlyNumber', function(){
        return {
            require: '?ngModel',
            link: function(scope, element, attrs, ngModelCtrl) {
                if(!ngModelCtrl) {
                    return;
                }

                // Only Int Numbers
                attrs.$observe('typeNum', function(value){

                    if(value == "int"){
                        ngModelCtrl.$parsers.push(function(val) {
                            if (angular.isUndefined(val)) {
                                var val = '';
                            }
                            var clean = val.replace( /[^0-9]+/g, '');
                            if (val !== clean) {
                                ngModelCtrl.$setViewValue(clean);
                                ngModelCtrl.$render();
                            }
                            return parseInt(clean);
                        });
                    }

                });

                // Only Decimal
                attrs.$observe('typeNum', function(value){

                    if(value == "decimal"){

                        // Now Check limit of decimal places

                    }

                });


                element.bind('keypress', function(event) {
                    if(event.keyCode === 32) {
                        event.preventDefault();
                    }
                });
            }
        };
    });

最佳答案

var parser;

attrs.$observe('typeNum', function (typeNum) {
  if (parser) {
    ngModelCtrl.$parsers.splice(ngModelCtrl.$parsers.indexOf(parser), 1);
  }

  switch (typeNum) {
    case 'int':
      parser = intParser;
      break;

    case 'decimal':
      parser = decimalParser;
      break;

    default:
      return;
  }

  ngModelCtrl.$parsers.push(parser);
});

// define intParser and decimalParser here


顺便说一句,请始终向parseIntyou’re in for big trouble添加一个基数参数:parseInt(clean, 10)

关于javascript - 指令中有多个$ observe,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/38356478/

10-16 00:11