AngularJS包括动态更改其位置

我有一些局部模板，其中位置根据用户通过ng click的操作进行更改：

<div ng-include="contentUrl"></div>

<button ng-click="contentUrl = '../partials/testScriptForm.html'">Add Test Script</button>

还尝试在其中添加$scope.$apply（）和$scope.$parent.$apply（），并获取错误：

错误：[$rootScope:inprog] $rootScope/inprog？p0=%24apply

---

也许我只是误用了includes…

用“虚线模型”引用转义隔离范围：

这是testScriptForm.html
更改为测试用例
这是testScriptCase.html
更改为测试表格

---

尝试使用对象

“content.Url='someFile.html'”

，而不仅仅是

“contentUrl='someFile.html'”

谢谢！我试图弄明白为什么ng click无法更改包含的模板，并且从来没有想到这是由于一个新的范围。我认为这需要一个简短的解释。这实际上与JavaScript复制内容的方式有关。没有点，我们引用的是标量变量。如果JavaScript复制了它，它就是那个，一个副本。对副本所做的任何更改都不会反映在原件上。另一方面：如果有一个点，那么“拷贝”不是一个标量变量，而是一个对象（答案中的tpl）。而一个对象是通过引用“复制”的，因此复制的tpl仍将指向原始对象，因此tpl.whatever也将改变“原始”上的tpl.whatever。感谢所有响应者完全解决了这个问题，并且解释非常有意义。事实上，我曾经尝试过一些简单的实验（认为这是因为我使用的是原语类型，复制而不是引用是问题），在按钮上使用ng click=“shared={prop:1}”等，但它不起作用……但简单的点表示法很好……我个人认为这是在星期五下午发布的；）

<button ng-click="contentUrl = '../partials/testScriptCase.html'">Add Test Case</button>

  $scope.changeParentLocation = (location) ->
      $scope.$parent.contentUrl = location

function Ctrl($scope) {
  $scope.tpl = {};
  $scope.tpl.contentUrl = '/partials/testScriptForm.html';
}