删除模板后，ng-include无法再次包含模板

Question

$scope.templateDOM = templatePath;

<div id="Template" ng-include="templateDOM"></div>

方案

1. 我添加了附加到范围的templatePath。

2. 添加templatePath后，可以在页面中看到templateDOM。

3. 现在从页面jQuery("#templateDOM").remove();中删除templateDOM。

4. 我再次尝试执行$scope.templateDOM = templatePath;这个逻辑。

5. 执行第4步后，我无法在页面中看到templateDOM。

Answer 1

您可以在模板路径后面添加查询字符串（可能是Date.now()的时间戳），如：

$scope.templateDOM = '/tempalte/view.html?a=' + Date.now();

<div id="Template" ng-include="templateDOM"></div>

当查询字符串更改时，它将重新编译。只是，您应该在需要重新编译时设置路径with Date.now()。

另一件事，我认为用jQuery删除元素不是一个好方法。您可以使用ng-if从DOM中删除它。

Answer 2

你必须使用＆＃39;＆＃39;如果您直接访问模板。

<div id="Template" ng-include="'templateDOM'"></div>

您删除模板时应使用正确的ID

jQuery("#template").remove();

我建议你使用ng-if代替你的div而不是用jquery删除

$scope.templateDOM = templatePath;

<div id="Template" ng-if="var" ng-include="templateDOM"></div>

将$scope.var触发为true或false，以显示/隐藏模板中的div。

问题是在删除div后，您没有在模板中添加该div。因此，触发ng-include的$ scope值不会产生影响，因为div不再存在于模板中。所以你必须把它添加回来。 如果您想使用Jquery，请遵循场景：

1. 添加templatePath并附加到范围。
2. 添加templatePath后可以看到中的templateDOM 页。
3. 现在从中分离 templateDOM page jQuery（＆＃34;＃templateDOM＆＃34;）。detach（）;。
4. 执行$ scope.templateDOM = templatePath之前; ，将div追加回到文档正文。

如何分离然后将元素追加到jquery中：How to Restore an Element Removed with jQuery?

希望有所帮助：）

Answer 3

试试这个：

$scope.templateDOM = 'templatePath';

<div id="Template" ng-include="templateDOM"></div>

Answer 4

在第4步中你试图包含一个已被删除的div？你可以尝试.detach（）或.empty（）而不是.remove吗？

Answer 5

• 实际上为什么你在angularjs中使用Jquery？这很糟糕。你可以angular.element()来做。 因为您的代码可能会从DOM中删除当前的

• 那么为什么要删除该模板然后添加？

  

您可以使用ng-show或ng-hide或ng-if来完成此操作，例如

<div id="Template" ng-show="isTemplate" ng-include="templateDOM"></div>

1. 您需要附加templatePath并使用$scope.isTemplate=true

之类的标记

2. 添加templatePath后，可以在页面中看到templateDOM。

3. 现在使用$scope.isTemplate=false

隐藏templateDOM

4. 如果您想要显示，请再次使用$scope.isTemplate=true

5. 执行第4步后，您可以看到elemtn