我在Angular 1.x项目中有一个场景,我需要在指令中查看控制器表单,以执行表单$dirty check.一旦页面上的表单变脏,我需要在注入的服务中设置一个标志.
@H_404_8@
@H_404_8@
var directiveObject = {
restrict: 'A',require: '^form',link: linkerFn,scope: {
ngConfirm: '&unsavedCallback'
}
};
return directiveObject;
function linkerFn(scope,element,attrs,formCtrl) {
...
scope.$watch('formCtrl.$dirty',function(oldVal,newVal) {
console.log('form property is being watched');
},true);
...
}
以上只是在初始化期间进入手表,所以我尝试了其他方法,结果相同：@H_404_8@
观察范围.$parent [formName].$dirty(在这种情况下,我在attrs中传递formName并将其设置为本地var formName = attrs.formName)@H_404_8@
看element.controller()[formName](与上面相同的结果)@H_404_8@
我查看了有关该问题的其他SO帖子,并尝试了列出的解决方案.它似乎应该工作,但不知何故,表单引用(表单属性引用)超出了指令范围,因此没有被监视.@H_404_8@
任何意见,将不胜感激.
谢谢.@H_404_8@
解决方法
我不知道为什么那个表不起作用,但作为传递整个表单的替代方法,你可以简单地将$dirty标志传递给指令.那是：
@H_404_8@
@H_404_8@
.directive('formWatcher',function() {
restrict: 'A',scope: {
ngConfirm: '&unsavedCallback',// <-- not sure what you're doing with this
isDirty: '='
},link: function(scope,attrs) {
scope.watch('isDirty',function(newValue,oldValue) {
console.log('was: ',oldValue);
console.log('is: ',newValue);
});
}
})
使用指令：@H_404_8@
@H_404_8@
<form name="theForm" form-watcher is-dirty="theForm.$dirty">
[...]
</form>
