我正在使用angularjs开发chrome扩展(使用内容脚本打开弹出窗口),但是当它的父页面已经使用angularjs时遇到了一些问题,它的父进程尝试编译插入的内容,所以无论如何都要阻止父angularjs实例编译我添加的元素,扩展中的angularjs实例可以手动引导元素吗?
答案 0 :(得分:0)
如果没有示例,或者您的扩展流程是什么,很难回答。
基本上,angular不应该编译它自己的任何内容,它可以在引导应用程序时执行,也可以在您明确告诉它时执行。
我猜你正在做的是在加载角度之前更改html,然后当它加载时它也会编译你的东西。 尝试添加你的指令等在 angular完成加载到主页面之后(如何检测角度完成引导是另一个问题:)。)。
使用ng-app <div ng-app="myAngularExtensionApp"></div>
添加新元素后,如果它嵌套在另一个角度应用程序中,我不确定它是如何工作的,我不会认为它将允许你这样做。如果主应用程序的ng-app在主体上,你可以在体外添加你的div(很奇怪,但是合法),它不应该发生冲突。但如果它在HTML上,它可能会导致问题。 (我测试了它,你可以在现有应用程序中引导另一个,但它可能会导致一些非常奇怪的问题,我会避免它。)
一个防弹解决方案,让事情变得更复杂一点我用过,我很喜欢它:
在页面上创建一个iframe,你在里面添加angularJS脚本,它将是你的应用程序,不要设置iframe的src,而是使用iframe.document.open()。write(
<html><body ng-app="myExtensionApp">
等(即角度页面的完整骨骼结构),现在因为src是相同的,你不会有相同的原点问题,你可以用top访问主页面。
我建议您提供与主页互动的服务。
我不确定你想做什么,但是如果你想在主页面上有一个指令,首先在iframe中创建它,然后通过jquery将它移动到主页面,它将属于你的角度应用程序(由于范围绑定基于原型,并且链条不会因移动元素而中断),因此它将继续对范围的变化做出反应。
但是你必须记住样式不受影响等。