我创建了这个数字格式指令,但如果我在多个输入上使用它,它对所有这些都不起作用,但只有一个可以工作。 有什么想法吗?
directive('formatUsNumber', function() {
return {
restrict: 'A',
require: 'ngModel',
priority: 100,
link: function(scope, element, attrs, ngModel) {
scope.formatNumber = function() {
var n = element.val();
var dest = n;
if (n.length >= 10) {
if (/^[A-Za-z\s]+$/.test(n)) {
return;
}
dest = n.replace(/\D/g, '');
if (!isNaN(dest)) {
n = dest;
}
if (n.substr(0, 1) != "1") {
n = "1" + n;
}
}
element.val(n);
ngModel.$setViewValue(n);
};
},
};
});
模板:
<input type="text" ng-change="formatNumber()" format-us-number ng-model="myModel" />
答案 0 :(得分:1)
尝试添加一个孤立的范围,如下所示:
restrict: 'A',
require: 'ngModel',
priority: 100,
scope:{
ngModel:'='
},...
答案 1 :(得分:1)
我认为这是因为指令范围不是孤立的。 而且我也做了一些改变,希望它的工作方式相同
directive('formatUsNumber', function() {
return {
restrict: 'A',
require: 'ngModel',
priority: 100,
scope: true,
link: function(scope, element, attrs, ngModel) {
scope.formatNumber = function() {
var n = ngModel.$modelValue;
if (n.length >= 10) {
if (/^[A-Za-z\s]+$/.test(n)) {
return;
}
n = n.replace(/\D/g, '');
if (!isNaN(dest)) {
n = dest;
}
if (n.substr(0, 1) != "1") {
n = "1" + n;
}
ngModel.$setViewValue(n, 'change:directive');
}
};
},
};
});
你可以测试它here
答案 2 :(得分:1)
对于这个用例,我认为更适合实现自定义过滤器而不是指令。 Building Custom AngularJS Filters 其他替代方案可能包括自定义解析器和/或格式化程序。 AngularJS - Formatters and Parsers