HTML注入到DOM破坏AngularJS事件 [英] Injecting HTML into the DOM destroys the AngularJS events

查看:148
本文介绍了HTML注入到DOM破坏AngularJS事件的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我已经包含在我的angularJS的应用程序,其中追加一些HTML身体第三方脚本

I have included a third party script in my angularJS app, which appends some HTML to the body

document.body.innerHTML += thirdPartyHTML;

只要做到这一点,好像我的 NG-点击事件将不会触发。是由第三方脚本附加在错误的道路的HTML代码的HTML,还是应该以某种方式刷新AngularJS对DOM 查看($范围。$适用)

Whenever that is done it seems like my ng-click events won't fire. Is the HTML by the third party script appending the HTML in the wrong way, or should I somehow refresh AngularJS view on the DOM ($scope.$apply)?

更新:好像我能重现错误,只调用document.body.innerHTML + ='';我。它显然并没有什么关系的onclick事件。如果你有自己的AngularJS应用程序,你可以尝试调用document.body.innerHTML + ='';后该文件已加载,并且没有任何NG-click事件的工作。

Update: It seems like I can reproduce the error, with just calling document.body.innerHTML += ''; myself. It apparently hasn't anything to do with the onclick event. If you have your own AngularJS app, you can try to call document.body.innerHTML += ''; after the document has loaded, and none of the ng-click events work.

推荐答案

每当的innerHTML 更改浏览器已经重新创建DOM树。这意味着,与现有的DOM元素相关的所有信息都将丢失。

Whenever innerHTML is changed the browser has to recreate the DOM tree. That means that all information associated with the existing DOM elements is lost.

这不仅包括事件侦听器。角门店作用域和DOM元素控制器。所以基本上应用已经一去不复返了。

This does not only include event listeners. Angular stores scopes and controllers on DOM elements. So basically the application is gone.

如果第三方应用程序确实改变了的innerHTML 主体元素,那么你最好让它前角运行。

If the third party app really changes the innerHTMLof the body element, then you better let it run before angular.

作为一种替代方法您可以手动初始化应用程序并且不使用 NG-应用。详细信息可以在 rel=\"nofollow\">

As an alternative you can initialize the application manually and don't use the ng-app. The details can be found in here

这篇关于HTML注入到DOM破坏AngularJS事件的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆