考虑一下代码：
<div id="dest">
<p>Original Content</p>
<p>Some data</p>
<ul>
<li ng-repeat="i in items">{{i.name}}</li>
</ul>
</div>
或者,使用jsf,一个小组：
<h:panelGroup id="dest">
Angularjs将理解指令ng-repeat,然后它将替换标签< li>按项目清单.
但是,如果您的html已更改,通过ajax加载或通过jsf reRender,AngularJS将无法识别新内容：
$('#dest').load('replace.html');
解决方法
我们需要为新DOM编译和应用AngularJS范围：
在控制器上,创建一个函数来编译一个新的html,并绑定到同一个范围：
$scope.compileDOM = function($el) {
($compile($el))($scope);
$scope.$apply();
};
并且,在加载后,将其命名为：
$('#dest').load('replace.html',function() {
$dest.scope().compileDOM($dest);
});
查看函数.scope().它允许为HTML元素找到正确的AngularJS范围.它不需要直接指向带有ng-controller的元素,可以使用ng-controller下的任何元素.
Plunker样品：PLUNKER