AngularJS 动态更改 ng-repeat 指令的模板

Question

是否可以更改模板ng-repeat用于动态呈现每个元素，就像选择元素从表/ ListView 切换到仅显示该元素的替代 View 一样？

我想要的是，在 ng-repeat 中选择一个元素后表/列表切换到仅显示所选元素。但我想保留ng-repeat结构(过滤器，分页)就位，因为我希望能够一次浏览每个元素(左右说)，并在任何时候返回到表/列表，其结构就位。

一旦选择了一个元素，也许更容易切换到使用新模板的新路由，但是我如何才能保持导航仅通过过滤的项目并恢复到 ng-repeat 的保存状态回到那条路线？

我希望我解释得足够好，提前谢谢你。

Answer 1

您可以使用 ng-switch ng-repeat 中的指令指示。这是一个基本示例:

<ul>
  <li ng-repeat="color in colors" ng-switch on="color.value" >
    <span ng-switch-when="orange" style="background-color:{{color.value}};">{{color.name}}</span>
    <span ng-switch-default>{{color.name}}</span>
  </li>
</ul>

全 jsFiddle .

更新

在评论中 Ninja Pants 澄清了最终目标是使用 ng-include包括模板。这是显示如何执行此操作的更新片段:

<ul>
  <li ng-repeat="color in colors" ng-switch on="color.value" >
    <span ng-switch-when="orange" ng-include src="'template.html'"></span>
    <span ng-switch-when="indigo" ng-include src="'template2.html'"></span>
    <span ng-switch-default>{{color.name}}</span>
  </li>
</ul>

还有一个 full Plunker demo .