Question

我有一个partial，它有一个指令，它在循环中使用编译的HMTL-as-a-string在循环中呈现一堆东西。这个HTML-as-a-string本身包含一个ng-include，它不会渲染出来。

基本上，这不包括template2.html：

element.html('<span>The name is ' + scope.content.name + '!</span><div ng-include src="template2.html"></div><br>');

任何指针都会非常感激。

谢谢！

Answer 1

WORKING DEMO

只需要写为

src=" \'template2.html\'"


var linker = function(scope, element, attrs) {
    element.html('<span>The name is ' + scope.content.name + '!</span><div ng-include src=" \'template2.html\'"></div><br>');
    $compile(element.contents())(scope);
};

DOCS

中的更多信息

Answer 2

Vinod上面的答案（用src="template2.html"替换src="\'template2.html\'"）是正确的，但我建议使用实际模板，而不是在链接功能中自己手动编译模板。在您的示例中，您实际上并没有获得双向绑定的好处。您只是获取编译函数的html输出，如果基础数据发生更改，它将永远不会更新。以下是您修改示例以显示绑定（以及Vinod的模板修复）：

http://jsfiddle.net/kf3vZ/5/

请注意，如果更改任何复选框的值，指令中的值不会更改。

现在这是一个使用指令的template参数的版本：

http://jsfiddle.net/kf3vZ/7/

现在，如果更改文本字段，指令值也会更改。

另一个注意事项是，由于您已经在使用模板的script标记，因此可以使用template替换指令中的templateUrl并提供脚本的id模板。

AngularJS在部分内部循环内的编译内部渲染模板

2 个答案: