< 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屋!