angularjs - AngularJS - 删除父元素的事件处理程序

Question

代码：

<table>
 <tr ng-click="function()">
  <td id="1"></td>
  <td></td>
 <tr>
</table>

如何从 td 中删除 id = 1 的点击处理程序？谢谢

Answer 1

我将这意味着您不想在 td id=1 中触发 click 事件处理程序，但您确实希望该行中的每个其他 td 仍然触发它。

ng-click 连接常规的 javascript 事件处理程序。由于您正在侦听 tr 元素上的 click 事件，因此您只需在事件触发子元素时停止传播即可实现这一点。

它可能最好写成指令

app.directive('disableClick', function() {
  return function(scope, elem) {
    elem.on('click', function(e) {
      // e.stopPropagation(); or for IE, window.event.cancelBubble
      return false; // My assumption is that jqLite supports this, jQuery definitely does.
    });
  }
});

HTML

<td disable-click id="1"></td>

点击事件将不再冒泡到 TR。

Answer 2

正确的方法是在指令中。我找到了一个可以帮助你的例子 这里有一个例子点击没有气泡

angular.forEach( 'click dblclick mousedown mouseup mouseover mouseout mousemove mouseenter   mouseleave'.split(' '),
    function(name) {

        var directiveName = name.replace('my-' , '');

        app.directive( directiveName, ['$parse', function($parse) {
            return function(scope, element, attr) {
                var fn = $parse(attr[directiveName]);
                element.bind(lowercase(name), function(event) {
                event.stopPropagation();
                scope.$apply(function() {
                fn(scope, {$event:event});
            });
        });
    };
}]);

我希望它有帮助