Question

是否可以更改模板ng-repeat用于动态呈现每个元素，例如从表/列表视图选择元素切换到仅显示该元素的备用视图？

我想要的是，在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。

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

1 个答案: