jQuery .find() 不适用于通过 Angular 加载的异步元素

Question

我正在使用 Angular 通过 ng-include 在我的 html 中包含一个模板，我正在使用 jQuery .find() 来做一些事情，比如这样:

$('.selector').find('.myClass').each(function(){ // do stuff })

看来模板中包含class 'myClass'的元素根本没有被jQuery.find()看到。

有什么办法可以做到这一点吗？

在此先感谢您。

Answer 1

来自https://docs.angularjs.org/api/ng/function/angular.element

jqLite is a tiny, API-compatible subset of jQuery that allows Angular to manipulate the DOM in a cross-browser compatible way. jqLite implements only the most commonly needed functionality with the goal of having a very small footprint.

假设您的代码示例位于 Angular 控制器或指令中，您没有处理 "normal" jQuery。为了使用所有 jQuery 函数，在 angular.

之前包含 jQuery

Answer 2

问题是 -- DOM 渲染。你需要做这样的事情：

$timeout(function () {
    angular.element('.selector').find('.myClass').each(function(){
       // do stuff
    })
})

如果是外部 jQ 文件，那么试试这个：

setTimeout(function () {
    $('.selector').find('.myClass').each(function(){
       // do stuff
    })
}, 0)

jQuery .find() 不适用于通过 Angular 加载的异步元素

jQuery .find() does not work on async elements loaded via Angular

jquery

asynchronous

find

angularjs