Question

我正在尝试在角度应用程序中运行一些jquery代码，我试图运行的代码涉及钩住某些选择器/

$(document).ready(function () {
  Configuration.anchorToUseForMainSearch = $("#header_element")
}

此选择器返回＆＃34;长度：0＆＃34;因为尚未加载DOM，我应该使用其他一些事件吗？

试图用这个：

angular.element(document).ready(function () {
        // Your document is ready, place your code here
});

但结果却相同......

Answer 1

您可以为此创建指令并设置执行代码的超时时间。

Answer 2

我会说，你走错了路。 Angular方式将避免使用jQuery。如果您绝对必须，我建议您将它放在主模块附带的.run（）中。我希望文件准备好＃34;在这个功能会激发的时候。

angular.module('myApp', [])
  .run(function myAppRunFn() {
     // commit sins here. 
  });

此处记录： https://docs.angularjs.org/guide/module

Answer 3

＆＃13;

var target = $("#wrapperDiv")[0]; //or document.body when you not sure
 
// create an observer instance
var observer = new MutationObserver(function(mutations) {
  mutations.forEach(function(mutation) {
    if($(mutation.addedNodes).filter('#header_element').length) {
        //code for what you want here
        console.log("Item added to DOM");
    }  
  });   
});

// configuration of the observer:
var config = { attributes: true, childList: true, characterData: true, subtree: true };
 
// pass in the target node, as well as the observer options
observer.observe(target, config);

setTimeout(function(){
    console.log('Adding Element from some other code');
    $("#innerDiv").append("<div id='header_element'>");
}, 2000);

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div id="wrapperDiv">

    <div id="innerDiv">
    
    </div>

<div>

＆＃13;

在angularJS app document ready事件

3 个答案: