< input>的AngularJS伪指令隐藏零最初加载到DOM [英] AngularJS directives to hide zero when <input> is initially loaded to the DOM

问题描述

我正在尝试实现一个角度指令，只要DOM处于DOM状态，就会隐藏零域。基本上这个

I am trying to implement an angular directive that will hide zero of field as soon as the is on DOM. basically this

当角度为零时，在输入中隐藏值

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

my code look something like this : <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 = '-';
                }
            });
        }
    };
});

但是，控制台日志永远不会打印。我也尝试了'input onload'，'input init'，'input all'和'input'，结果相同。当DOM被首次添加到DOM中时，我不知道发生什么事件关键字？或者我怎么知道？
您可以检查代码 http://plnkr.co/edit/TwraJlxZSd3TeSYscExq？ p = preview

However,the console log is never printed. I also tried 'input onload', 'input init', 'input all', and 'input', with all the same result. I don't know what event keyword is emitted when the is first added to the DOM? or how can I find out? You can check the code out http://plnkr.co/edit/TwraJlxZSd3TeSYscExq?p=preview

推荐答案

看看 $ formatters 为此目的它们旨在在模型更改或初始加载时格式化模型的视图。 Plunkr http://plnkr.co/edit/SA9xz6eQmk3t7qfRack7?p=preview

Take a look at $formatters for this purpose. They are designed to format the view of the model when the model is changed or initially loaded. Plunkr http://plnkr.co/edit/SA9xz6eQmk3t7qfRack7?p=preview

您的指令将会如下所示：

Your directive would then look something like this:

.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;
        });
      }
    };
  }]);

加载事件可能不会触发所有元素。 单个元素上的Jquery on（）加载事件

The load event may not fire for all elements. Jquery on() load event on a single element

这篇关于< input>的AngularJS伪指令隐藏零最初加载到DOM的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！