Question

我坚持以下情况。我有动态模板（template.html）和ng-include。

<div data-ng-include data-src="childTemplate">{{ var }}</div>

如果我尝试这样做：

$scope.childTemplate = 'child.html';
tpl = $compile($templateCache.get('template.html'))($scope);

在这种情况下，tpl仅包含没有子模板的已编译父模板。我试着做

<div data-ng-include data-src="childTemplate" onload="templateLoaded()"></div>

和

tpl = $compile($templateCache.get('template.html'))($scope);
$scope.contentLoaded = function() {
    $compile($templateCache.get('child.html'))($scope)
}

在这种情况下，child.html已加载但未包含在父模板中。如何解决任务？谢谢！

Answer 1

tpl现在是在DOM上编译的元素。在编译child.html之后，您应该做的是将其添加到DOM中。

因此，您可以执行以下操作：

tpl = $compile($templateCache.get('template.html'))($scope);
$scope.contentLoaded = function() {
    var child = $compile($templateCache.get('child.html'))($scope);
    tpl.appendChild(child);
}

如果你想将child.html模板添加为tpl个孩子的最后一个（如果没有，你应该导航它），这可能会有效。

使用ng-include编译动态模板

1 个答案: