使用jQuery按类在Angular JS指令中选择由ng-repeat创建的元素？

Question

我已经查看了Angular网站here上的文档，但我仍然有点困惑。

我有一个角度指令，他的模板包含ng-repeat创建的元素。这些元素中的每一个都有一个共同的类。我试图按类选择这些元素，以便在属于该类的元素上触发事件时可以传递处理程序。

据我所知，here我可以选择使用jqLite或angular.element()选择这些元素。我的jQuery包含在包含Angular之后。我假设这应该以这种方式完成，因为我希望选择特定类的元素，而Angular通过我的指令生成它们。

我实际上并没有尝试在课堂上使用.click()事件，它只是一个概念验证。我在与指令的contains元素关联的控制器中有以下代码：

$(".gallery-image").click(function(){
        alert("test");
});

我试图做的事情应该是相当明显的，我只是不确定如何处理这个Angular和jQuery的混合。

如何在这些元素上选择并运行带有jQuery的事件处理程序？

Answer 1

像这样使用

$(document).on("click", ".gallery-image", function(){
        alert("test");
});

您无法直接在".gallery-image"上进行选择，因为当您将点击事件绑定到他们时，它们都没有在页面上

但是你总是可以对ng-click中你不需要使用jQuery来绑定click事件的项目使用ng-repeat指令。

Answer 2

如果您在jQuery之后加载Angular，则angular.element将保留为jQuery的简化版本：jqLit​​e。

  

要使用jQuery，只需确保在angular.js文件之前加载它。

所以你需要先加载jQuery。您可以通过angular.element === jQuery检查控制台。

如果您包含ng-repeat，请始终使用$timeout等待渲染完成。然后你可以访问元素。

但是，当然，只要有可能，请始终使用ng-click代替.on('click',...。