Question

我有一个限制为3个项目的列表，第一个项目需要课程blue1，第二个需要blue2，第三个blue3。

<ul>
    <li ng-repeat="tag in chartTags" class="blue-tag">
        <div class="tag blue1" ng-class="{blue1: tag == 1 }">{{tag.term}}</div>
    </li>
    <!-- <li><div class="tag blue1">item1</div></li>
    <li><div class="tag blue2">item2</div></li>
    <li><div class="tag blue3">item3</div></li> -->
</ul>

有没有办法像支持ng-class="{blue1: tag == 1 || blue2: tag == 2 || blue3: tag == 3 }"

这样的支票

Answer 1

我认为您可以通过$index无需使用跟踪来解决此问题，因为您没有重复项。

<强>标记

<li ng-repeat="(k, v) in chartTags" class="blue-tag">
     <div ng-class="{blue1: k == 1 , blue2: k == 2 , blue3: k == 3 }">{{v.term}}</div>
</li>

Answer 2

使用<ul> <li ng-repeat="tag in chartTags track by $index" class="blue-tag"> <div class="tag " ng-class="{blue1: $index== 0 ,blue2: $index== 1 ,blue3: $index== 2 }">{{tag.term}}</div> </li> </ul>。

"${getTeamName}" != "Test Team"

请参阅plunker

Answer 3

首先，您必须使用track by跟踪索引并使用,分隔类条件，而不是||

像这样

<li ng-repeat="tag in chartTags track by $index" class="blue-tag">
      <div class="tag" ng-class="{blue1: $index == 0, blue2: $index == 1, blue3: $index == 2 }">{{tag}}</div>
</li>

如何使用$ index来改变ng-repeat中的类？

3 个答案: