如何监视更改DOM的AngularJS [英] How to watch the DOM for changes AngularJS
问题描述
这似乎是一个愚蠢的问题，但我需要知道如何观看页面的整个DOM，并重新编译任何它改变的时间。从本质上讲这是AngularJS的默认操作通过使用数据绑定的，但我需要这种改变，不仅仅是绑定在DOM随时发生的任何事情。究其原因，就是因为我有一个在HTML，JavaScript和PHP完全建立的应用程序。它是一个单页的应用程序，它有一个主页，PHP注入到该页面中的DIV包装。
This may seem like a silly question but I need to know how to watch the entire DOM of a page and recompile it any time it changes. Essentially this is what AngularJS does by default by use of databindings, but I need this to happen anytime anything in the DOM is changed, not just bindings. The reason why is because I have an app that is built entirely in HTML, Javascript and PHP. It's a single page application, it has a main page and injects PHP into a DIV wrapper within that page.
我要进行一些修改，但要保留我的code由原来的code完全分开的。要做到这一点，我需要能够重新编译DOM随时随地与它自己的DOM结构一个新的PHP文件注入。我至今没有出现一起工作。
I want to make some modifications to it but want to keep my code completely separate from the original code. To do this I need to be able to recompile the DOM anytime a new PHP file with it's own DOM structure is injected. What I have so far does not appear to be working.
app.directive("watch", function () {
return function (scope, element, attr) {
scope.$watch("watch", function(oldValue, newValue) {
if(newValue) {
console.log("there is a new value");
console.log("the new value is " + newValue);
}
});
}
});
我添加监视的属性在＆LT;身体GT; 标签，但它似乎没有工作，当DOM改变没有被记录下来。最后，我想替换$编译了的console.log，但我首先需要拿到手表的工作。可有人点我，我做错了什么？
I add the watch attribute the the <body> tag but it doesn't seem to work, when the dom is changed nothing gets logged. Ultimately I'd like to replace the console.log with $compile, but I first need to get the watch to work. Can someone point me to what I'm doing wrong?
推荐答案
因此，正如我已经在我的上述评论指出，这是一个坏主意，做你想要做的事。也就是说，如果你还愿意走这条路，你可以 $观看只是在传递一个函数作为第一个参数任何东西。
It's a bad idea, but I'll humor you.
So as I've stated in my comments above, it's a bad idea to do what you're trying to do. That said, if you still want to go this way, you can $watch just about anything by passing a function in as the first parameter.
在code下面将检查是否＆LT内部的HTML;身体GT; 标记已经改变。请注意，这是一个可怕的想法。
The code below will check to see if the HTML inside the <body> tag has changed. Please note, that this is a HORRIBLE idea.
$scope.$watch(function () {
return document.body.innerHTML;
}, function(val) {
//TODO: write code here, slit wrists, etc. etc.
});
手表上面会随时解雇的 ANYTHING 的HTML中的变化。
- 当输入一个值改变
- 当在下拉列表中选择更改
- 当属性在HTML的任何元素发生变化。
- 等
其他信息：截至目前，在一大堆的浏览器，有监视已加载新的DOM元素的好办法不是真的。最好的办法是仍然在加入新的DOM元素的瞬间触发事
Additional Info: As of right now, in a whole lot of browsers, there's not really a good way to monitor for new DOM elements which have been loaded. The best way is still to trigger something at the moment the new DOM elements were added.
这篇关于如何监视更改DOM的AngularJS的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
