ng-repeat动态变量名称

问题描述

我正在实现ng-repeat来为Bootstrap手风琴界面创建元素.

I am implementing ng-repeat to create elements for a bootstrap accordion interface.

我正在执行ng-repeat，但是我遇到的问题是，我需要动态创建ID才能分别针对手风琴元素.

I have ng-repeat working however the issue I have is that I need to dynamically create the ID in order to target the accordion element individually.

我的ng-repeat HTML块参考:

My ng-repeat HTML block references:

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

并降低参考文献:

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

为使此方法正常运行，塌陷度必须动态-塌陷1，塌陷2等.如何在ng-repeat中迭代值? 崩溃" +我基本上就是我要实现的目标.

For this to work correctly, collapseOne needs to be dynamic - collapse1, collapse2 etc. How is it possible to iterate values in ng-repeat? "collapse" + i basically is what Im trying to achieve.

第二，只有ng-repeat列表中的第一项需要此行上的"in"类:

Secondly, only the first item in the ng-repeat list requires the "in" class on this line:

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

这可以确保第一个项目被打开.

This ensures the first item is opened.

预先感谢您的帮助

推荐答案

您可以使用ng-repeat的内置$index. (此处的文档: https://docs.angularjs.org/api/ng/directive/ngRepeat )

You could use ng-repeats built-in $index. (Documentation here: 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">

Etcetera.

默认情况下，要打开第一个div，我认为您可以像这样使用ng-class:

For opening the first div by default I think you can use ng-class like this:

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

这篇关于ng-repeat动态变量名称的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！