Angularjs 使用定位标记动态更改div的内容

我在如何使用Angularjs在锚定标记中加载动态视图方面遇到了问题。顺便说一下，我不能使用ng view，因为ng view在模板中只能使用一次。因此，我考虑使用ngsrc，但在示例文档中，它使用select元素标记并将其值提取到控制器。我想要的是，当我点击一个链接（比如View1）时，我的div的内容会改变。我会进一步解释

假设我有3个锚定标签

<li><a href="#/view1">View1</a></li>
<li><a href="#/view2">View2</a></li>
<li><a href="#/view3">View3</a></li>

以前

 <div data-ng-include="" data-ng-src="default.html"></div>

现在，当我单击#/view1时

//html的ng src将根据单击的链接而变化

也许您正在尝试执行以下操作：

HTML:

<!-- Dont use # in the hrefs to stop the template from reloading -->
<li><a href="" ng-click="selectedTemplate.path = 'view1.html'">View1</a></li>
<li><a href="" ng-click="selectedTemplate.path = 'view2.html'">View2</a></li>
<li><a href="" ng-click="selectedTemplate.path = 'view3.html'">View3</a></li>

<div data-ng-include="selectedTemplate.path"></div>

$scope.selectedTemplate = {
    "path":"view1.html"
};

---

ng视图是任何角度应用程序的主视图，受路线更改的影响。因此，所有锚定标记只会影响ng视图模板

要基于主ng视图加载其他局部视图，ng include是正确的方法，正如您已经提到的

要基于主视图（在ng视图中显示的视图）加载视图，您需要编写映射逻辑，该逻辑根据主视图应加载其他部分（ng包含页面的元素）

所以你的偏态变成了

<div data-ng-include='templateNameVariable'></div>

---

ng视图

也会这样做。阅读$route和$routeProvider上的文档。@Codezilla，我不能再使用ng视图了，因为我已经在其他局部视图上使用过它。我认为ng视图每个模板只能使用一次。对吗？

ng src

通常归因于

img

标签。您正在寻找

ng include

？@davintroon，是的，我正在考虑使用ng include实现与ng视图一样的动态视图。不知道如何实现它，虽然使用角度t__T@WonderingCoder哎呀！我没有仔细阅读这个问题。你可以看看我下面给出的答案。如果你不想要控制器，甚至不需要使用

JS

。

selectedTemplate.path

将添加到当前范围@Davintroon我认为JS很重要，以防所有的

li

s在ng中重复，或者会创建一个不同的范围。没错，只是一个注释，对于简单的情况，如果没有它，JS可以工作。

<div data-ng-include='templateNameVariable'></div>

$scope.$on('$routeChangeSuccess',function(event,current,previous) {
     //Change the templateNameVariable to point to correct template here, based on current route.
});