Question

我有一个动态创建元素的代码（x和parentDiv）。

var x = document.createElement('myTag');
parentDiv.appendChild(x);

我的指令看起来像这样：

.directive("myTag", function($compile) {
    return {
        restrict: "E",
        replace: true,
        template: "<span><img src='something/url/img.png'></img></span>"
    }
})

如何在指令中将myTag标记替换为该代码？我知道使用$ compile，因此AngularJS之外的代码可以涵盖在其范围内，但我不知道在哪里放置它。

Answer 1

实际上，在添加元素之前，您应该使用compile：

var childScope = scope.$new();
var x = document.createElement('myTag');
var compiled = $compile(x)(childScope);
parentDiv.appendChild(compiled);

$compile服务将获取模板：

<span><img src='something/url/img.png'></img></span>

并将其放在以x引用的DOM元素中。

在AngularJS中动态创建元素后绑定指令

1 个答案: