$observe不会触发更改，也不会插值
TLDR:为什么angular的ngMinlength会收到带内插值的$observe更新，而我的自定义验证指令却不能？
Link to plnkr
我正在处理Angular 1.3中的一个自定义验证指令，并注意到一些似乎不一致的东西。angular中的指令似乎从attr.$observe中获得了插值更新，但我创建的指令并不以同样的方式运行。
我可以使用$watch来修复它，或者绑定一个插入值，但这与现有的验证指令不一致。有什么不同，我如何让我的自定义指令与内置的验证指令类似地工作？
安格尔氏指令
var minlengthDirective = function() {
return {
restrict: 'A',
require: '?ngModel',
link: function(scope, elm, attr, ctrl) {
if (!ctrl) return;
var minlength = 0;
attr.$observe('minlength', function(value) {
minlength = int(value) || 0;
ctrl.$validate();
});
ctrl.$validators.minlength = function(modelValue, viewValue) {
return ctrl.$isEmpty(viewValue) || viewValue.length >= minlength;
};
}
};
};我的指令
function observeMinLength($log){
return {
restrict: 'A',
require: '?ngModel',
link: function (scope, elm, attr, ctrl) {
if (!ctrl) return;
var min;
//Problem 1: observered value is not interpolated
//Problem 2: observe is only fired one time
attr.$observe('observeMinlength', function (value) {
$log.debug('observed value: ' + value);
min = parseInt(value, 10) || 0;
ctrl.$validate();
});
ctrl.$validators.mymin = function (modelValue, viewValue) {
var len = 0;
if (viewValue){
len = viewValue.length;
}
return ctrl.$isEmpty(viewValue) || viewValue.length >= min;
};
}
};
}回答 1
Stack Overflow用户
发布于 2016-08-05 22:41:35
注意，ngMinlength指令是$observing "minlength“属性，而不是"ngMinlength”属性。我认为问题是Angular的输入指令正在根据插值的值设置minlength属性……因此，虽然ngMinlength属性的值不会随着其值的变化而变化，但minlength属性会随着值的变化而变化，这就是为什么它是可观察的。在您的指令中，属性observeMinLength不会更改，但您传入的scope属性的值会更改。
如果查看angular源代码：https://github.com/angular/angular.js/blob/13b7bf0bb5262400a06de6419312fe3010f79cb2/src/ng/directive/attrs.js#L379，您可以看到angular正在监视范围变量，并为ALIASED_ATTR集合中的所有属性设置属性变量。该集合定义为
var ALIASED_ATTR = {
'ngMinlength': 'minlength',
'ngMaxlength': 'maxlength',
'ngMin': 'min',
'ngMax': 'max',
'ngPattern': 'pattern'
};因此，简而言之，Angular对它自己的基于属性的验证指令有特殊的处理。所以你需要注意你的作用域属性，而不是观察属性。
https://stackoverflow.com/questions/38791470
复制相似问题
腾讯云开发者
