将单击事件绑定到角度链接器中的元素和子元素

Question

我有一条指令，基本上是一张大桌子。 在表格的某些单元格中，我有一些内容的div。 每当单击div时，我console.log("clicked")做某事（在下面的代码中以console.log("clicked")为例）。

事实是div也包含其他html元素，如果单击后代html元素之一，则不会发生任何事情。 因此，我想在单击父div以及单击任何后代元素时都进行操作。

单击div时，以下操作会执行某些操作，但单击任何后代时，则不会执行以下操作：

link: function(scope, element) {
  element.on("click", function(e) {
    if (e.target.className.match('myclass')) 
       {
         console.log("Clicked!");
       }
    });
   }

单击div以及元素中带有“ myclass”的任何元素时，如何确保上述情况发生？

Answer 1

您在活动中需要的是

if (e.target.className.match('myclass') || $(e.target).closest('.myclass')) {
      alert("Clicked!");
    }

函数closest（）允许您在父母中进行搜索。

（我假设您的项目中有jQuery，因为它是标签的一部分）

话虽如此，除非有必要，否则我强烈建议您不要混合使用jQuery和AngularJs。 在大多数情况下，您无需在项目中完全使用jQuery就可以实现类似的功能。

我相信，如果您在每个div的模板中仅使用ng-click="someFunction()" ，则可以获得相同的功能-当从子元素中单击时，它将触发