正如您可能意识到的那样，您需要调用
$scope.$apply()它以
{{bindings}}从范围值更新。但是您无法在异步函数中执行此操作的原因是，您正在针对的现有范围编译HTML
#target，然后尝试仅追加HTML。那是行不通的，因为您需要在DOM中拥有已编译的节点，要么通过使用jQuery
.append()或类似方法附加整个已编译的节点，要么
innerHTML先设置DOM
，然后再编译DOM中的节点。之后，您可以调用
$apply该作用域，并且由于该指令是在DOM中编译的，因此它将正确更新。
换句话说，如下更改您的异步代码。
代替：
target.innerHTML = $compile(html)($scope)[0].outerHTML$scope.$apply()
更改为：
target.innerHTML = html;$compile(target)($scope);$scope.$digest();
请注意，我做了一个
$digest()代替
$apply()。这是因为
$apply()从开始对每个范围进行了摘要
$rootScope。您只需要消化与之链接的那个作用域，因此就足以消化该作用域（对于具有许多作用域的任何大小合理的应用程序，速度都更快）。
分叉的小提琴
更新：Angular可以编译字符串和分离的DOM节点
我刚刚检查了一下，OP实际上是正确的，假设Angular可以很好地编译HTML字符串或分离的DOM节点。但是，您需要做的是确保将编译后的 节点
实际附加到DOM，而不仅仅是HTML。这是因为Angular将诸如范围和绑定信息之类的内容存储为DOM节点*上的jQuery /
jQueryLite数据。因此，您需要在整个节点上附加这些额外的信息，以便
$digest()可以工作。
因此，进行此工作的另一种方法是将上述OP的代码的相同部分更改为：
target.appendChild($compile(html)($scope)[0]);$scope.$digest()
*从技术上讲，它存储在内部jQuery数据高速缓存中，而高速缓存键存储在DOM节点本身上。
