AngularJS指令隐藏为零时 最初加载到DOM(AngularJS directives

2019-10-24 12:38发布

我想实现的角度指令,将尽快隐藏字段的零,因为是DOM。 基本上是这样的

隐藏价值输入时,它的零角度的js

我的代码看起来是这样的: <input hide-zero-onload ng-model="test"></input>

.directive('hideZeroOnload', function() {
    return {
        link: function(scope, element) {
            element.on('input load', function() {
                console.log('loaded');
                if (this.value === '0') {
                    this.value = '-';
                }
            });
        }
    };
});

然而,控制台日志从不打印。 我也试过“输入的onload”,“输入初始化”,“输入所有”和“输入”,与所有相同的结果。 我不知道是什么事件关键字时,首先被添加到DOM发出? 或者我怎么能找到? 您可以检查代码进行http://plnkr.co/edit/TwraJlxZSd3TeSYscExq?p=preview

Answer 1:

看看$formatters用于这一目的。 它们的设计时模型更改或最初加载格式化模型视图。 Plunkr http://plnkr.co/edit/SA9xz6eQmk3t7qfRack7?p=preview

然后,您的指令将是这个样子:

.directive('hideZero', [ function() {
    return {
      require: '?ngModel', // get a hold of NgModelController
      link: function(scope, element, attrs, ngModel) {

        // Specify how UI should be updated
        ngModel.$formatters.push(function(value) {
          if (value === 0) {
            // If the value is zero, return a blank string.
            return '';
          }

          return value;
        });
      }
    };
  }]);

load事件可能不会触发的所有元素。 Jquery的上()的单个元件上加载事件



文章来源: AngularJS directives to hide zero when is initially loaded to the DOM