ng-repeat 动态变量名

Question

我正在实现 ng-repeat 来为引导手风琴界面创建元素。

我有 ng-repeat 工作，但我遇到的问题是我需要动态创建 ID 以便单独定位手风琴元素。

我的 ng-repeat HTML 块引用：

<div class="panel-heading" data-toggle="collapse" data-parent="#products-accordion" href="#collapseOne">

并降低参考：

<div id="collapseOne" class="panel-collapse collapse in">

为了让它正常工作，collapseOne 需要是动态的——collapse1、collapse2 等。如何在 ng-repeat 中迭代值？ "collapse" + i 基本上是我想要实现的目标。

其次，只有 ng-repeat 列表中的第一项需要这一行的“in”类：

<div id="collapseOne" class="panel-collapse collapse in">

这样可以确保打开第一个项目。

提前感谢您的帮助

Answer 1

您可以使用ng-repeats 内置的$index。 （此处的文档：https://docs.angularjs.org/api/ng/directive/ngRepeat）

所以它看起来像这样：

<div id="collapse_{{ $index }}" class="panel-collapse collapse in">

将创建：

<div id="collapse_0" class="panel-collapse collapse in">
<div id="collapse_1" class="panel-collapse collapse in">

等等。

对于默认打开第一个div，我认为您可以像这样使用ng-class：

<div id="collapse_{{ $index }}" ng-class="{ in : $index == 0 }" class="panel-collapse collapse">