AngularJS 1.3 – 整个表单的“更改类”功能

它可能甚至不需要，因为如果您正确组织视图模型，那么您的表单输入可能会绑定到某个范围暴露的属性：

$scope.formData = {};

并在视图中：

<form name="form1">
  <input ng-model="formData.a">
  <input ng-model="formData.b">
</form>

然后，您可以深入观察(使用$ watch)进行模型更改(并对您需要的元素应用任何去抖动选项)：

$scope.$watch("formData",function(){
  console.log("something has changed");
},true);

那么问题当然是这是一个深刻的手表，它是昂贵的。此外，它不仅对Form中的更改做出反应，还对来自任何来源的formData进行更改。

所以，作为一种替代方案，您可以创建自己的指令来表达形式并对表单的更改事件作??出反应。

.directive("formOnChange",function($parse){
  return {
    require: "form",link: function(scope,element,attrs){
       var cb = $parse(attrs.formOnChange);
       element.on("change",function(){
          cb(scope);
       });
    }
  }
});

用法是：

<form name="form1" form-on-change="doSomething()">
  <input ng-model="formData.a">
  <input ng-model="formData.b">
</form>

plunker用于说明。

请注意，根据jQuery documentation:，“更改”事件仅在文本输入的模糊时触发

The change event is sent to an element when its value changes. This event is limited to <input> elements,<textarea> boxes and <select> elements. For select boxes,checkboxes,and radio buttons,the event is fired immediately when the user makes a selection with the mouse,but for the other element types the event is deferred until the element loses focus.