Question

问题：

我有一个ng-include指令指向一个内部有pre元素的html部分。我有一些javascript代码，它们针对父页面或子部分页面上的任何pre元素。我能够定位目标页面上的任何前置元素，但无法在子部分页面上定位前置元素或任何其他元素。

我的测试 我观察到当我转动我的chrome扩展以清除缓存时，我能够引用pre元素但是当我关闭它时我无法引用pre元素。

我尝试使用.run( function () {$templateCache.removeAll() } )，但这不起作用。

我还尝试在ng-include div元素上使用$window.load和onload属性，但这也不起作用。

设置

的index.html

<div data-ng-include("'partial.html'")></div>

partial.html

<pre><p>This is a pre element</p></pre>

app.js

var pre = document.getElementsByTagName( "pre" );

                for( var i = 0; i < pre.length; i++ ){
                    console.log( pre[i].innerHTML );
                }

您还可以看到示例here

Answer 1

您的代码似乎在ng-include提供HTML解析之前处理。

只有在HTML已经加载时才需要触发该功能。

另外，更改代码的一些声明：

<div data-ng-include("'partial.html'")></div>

// to

<div data-ng-include="'partial.html'"></div>

添加onload属性，调用您的控制器范围内的函数：

<div data-ng-include="'partial.html'" onload="onLoad()"></div>

实际上，对这种方法存在担忧：您希望在控制器内进行DOM操作。这不是在Angular上处理它的传统方法。您需要为它设置一个指令并在那里处理/解析DOM。

此外，您无需像这样应用广泛的调用来管理DOM修改。您可以为所需的<pre>元素设置指令，让他们完成工作。

Angular JS ng-包含javascript无法正常部分onload

1 个答案: