假设给定的形式如 <form name="myForm">
,使用简单的手表观察有效性,错误,脏状态等很容易:
$scope.$watch('myForm.$valid', function() {
console.log('form is valid? ', $scope.myForm.$valid);
});
但是,似乎没有一种简单的方法可以观察此表单中的任何给定输入是否已更改。如此深入观察,不起作用:
$scope.$watch('myForm', function() {
console.log('an input has changed'); //this will never fire
}, true);
$watchCollection
只有一个深度,这意味着我必须为每个输入创建一个新的手表。不理想。
什么是一种优雅的方式来观看表单以便在任何输入上进行更改,而无需使用多个手表或放置 ng-change
在每个输入?
关于 可能重复 和你的评论:
该问题中的指令解决方案有效,但它不是我想到的(即不优雅,因为它需要模糊才能工作)。
它可以添加 true
作为你的第三个参数 $watch
:
$scope.$watch('myFormdata', function() {
console.log('form model has been changed');
}, true);
更多信息见 文档。
工作小提琴 (查看控制台日志)
另一个 更有棱角的方式 将是使用角度的 $pristine
。此布尔属性将设置为 false
一旦你操作表单模型:
小提琴
根据我对表单的体验(新开发,但现在与Angular合作一段时间),观看表单进行更改的优雅方式实际上根本不使用任何类型的watch语句。
使用内置的Angular boolean $ pristine或$ dirty,这些值将在任何输入字段或复选框上自动更改。
问题是:如果你从一个让我困扰了一段时间的数组中添加或拼接,它将不会更改该值。
对我来说最好的解决方法是手动执行 $scope.MyForm.$setDirty();
每当我从我的不同阵列添加或删除。
像魅力一样工作!