如何监视更改DOM的AngularJSDOM、AngularJS

由网友(灼灼桃花仙)分享简介:这似乎是一个愚蠢的问题,但我需要知道如何观看页面的整个DOM,并重新编译任何它改变的时间。从本质上讲这是AngularJS的默认操作通过使用数据绑定的,但我需要这种改变,不仅仅是绑定在DOM随时发生的任何事情。究其原因,就是因为我有一个在HTML,JavaScript和PHP完全建立的应用程序。它是一个单页的应用程序,...

这似乎是一个愚蠢的问题,但我需要知道如何观看页面的整个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);
             }
         });
     }
});

我添加监视的属性在<身体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.

阅读全文

相关推荐

最新文章