javascript - 捕获子元素的变化事件

Question

我对 AngularJS 相当陌生，可以使用一些帮助来解决以下问题:我有一个包含很多列和输入元素的表。每当用户更改输入元素的值时，我希望“编辑”行集。我通过向每个输入元素添加 ng-change 指令来实现这一点:

<table>
   <tr data-ng-repeat="item in vm.Model.data>
      <td>
         <input type="text" ng-model="item.Title" ng-change="item.changed=true" />
      </td>
      .
      .
   </tr>
</table>

这个解决方案的问题是我有很多列，并且我必须为每个“输入”元素编写 ng-change 指令。有没有办法捕获“tr”元素级别上任何输入元素的更改事件？

Answer 1

您可以编写自己的指令来监听 onchange 事件冒泡(ngChange 指令在这种情况下不起作用)。

.directive('onChange', function() {
    return {
        link: function(scope, element, attrs) {
            element.on('change input', function() {
                scope.$eval(attrs.onChange);
                scope.$digest();
            });
        }
    };
});

并使用它:

<tr data-ng-repeat="item in data" on-change="item.changed=true">

演示:http://plnkr.co/edit/lzIQ00l7aqXYlNCekWY8?p=preview