2013-08-27 3 views
14

私はng-repeatにリストを作成していますので、すべてliの要素を、父親のn番目の子供、特定のクラス(私たちのng-repeatでは、中央よりも大きい指数)。たとえば、リストが10項目の場合、5番目、6番目... 10th li子供をクラスにする必要があります。だから、 私のコードは、この何かある場合 - 中央のインデックスからと上の子供たちにクラスを割り当てることも可能と良い方法は何Ng-Repeatの角度設定クラス

[ul] 
    [li ng-repeat="friend in friends"] 
     {{friend.name}} who is {{friend.age}} years old. 
    [/li] 
    [/ul] 

?私の条件は、私はhtmlの構造を変更すべきではないということです。 directives\filtersを追加したり、コントローラーに追加したりすることができます。

+0

のように 'ng-class =" {'yourClass':$ index> friends.length/2} ''のようなものを追加するだけです。 – Yoshi

+2

は黒い魔法のように見えますが、それはうまくいくのでしょうか? –

+1

はい私はかなり確信しています;)ロジックが変更される場合は、もちろんビューから抽出してコントローラに決定させることができます。例: 'ng-class =" someConrollerMethod($ index、friends) "' – Yoshi

答えて

29

単に例えば、繰り返し要素にng-classを使用します。

<li 
    ng-repeat="friend in friends" 
    ng-class="{special: $index > friends.length/2 - 1}"> 

    {{friend.name}} 
</li> 

デモ:http://jsbin.com/iFigAYi/1/


またはロジックを抽出し、同じよう:

<ul> 
    <li ng-repeat="friend in friends" ng-class="getClass($index, friends)"> 
    {{friend.name}} 
    </li> 
</ul> 

$scope.getClass = function getClass(idx, list) { 
    return { 
    special: idx > list.length/2 - 1 
    }; 
}; 
+1

私は "特別な"は引用符 – nuander