AngularJS - 在指令中選擇動態NG重複DOM元素

Question

問題：
我有有一個列表<ul>和動態生成的列表項<li>個指令。我想更改這些<li>項目之一的css。

下面的代碼中的指令的template屬性：

<ul> 
    <li ng-repeat="color in colors" ng-class="{selected: (color===selected) }" ng-click="pick(color)" style="background-color:{{color}};"></li> 
</ul> 

我想改變第三個元素的CSS，即$first + 2，但我不知道如何訪問它。

我已經試過
1）因爲我想要的指令，沒有jQuery的工作，我一直在試圖與angular.element（這是jqLit​​e）。我可以訪問指令link內<ul>angular.element.find('li')或element.children()，但我似乎無法得到「更進一步」，因爲它們是動態創建的（我猜）。

2）我一直在試圖通過$first+2訪問它，並在ng-repeat這樣添加CSS類到它：

<ul> 
    <li ... ng-class="{ ... , cssClass: ($first+2) }" ...></li> 
</ul> 

但隨後<li>元素的影響。

Here's a working plunker

Answer 1

可以使用$index

<li ng-class="{ cssClass: $index == 2 }"></li>