Угловая вложенная переменная класса ng-repeat

Question

Итак, у меня довольно сложная угловая таблица, и у меня есть повторяющаяся часть, которую можно использовать, но когда я устанавливаю переменную с ng-class-even а также ng-class-oddпеременная, кажется, не сохраняется. Может быть, я неправильно понимаю сферу ng-repeatно я в тупик.

Мой повтор выглядит примерно так:

<tr ng-repeat-start="item in data.group" ng-class-even="color='red'" ng-class-odd="color='blue'">
    <td>{{item.name}}</td>            
    <tr ng-repeat-end ng-repeat="inner in item.innerdata" ng-class="color">
        <td>{{inner.innername}}</td>
    </tr>
</tr>

Итак, я ожидаю, что цвет будет установлен во время цикла строк. Вот Скрипка с примером настройки.

Answer 1

ng-class-even & ng-class-odd будет смотреть на текущий ng-repeat $index object и решает, какое значение следует дать атрибуту класса.

ng-class-even/ng-class-odd

Принимает выражение, и результатом оценки может быть строка, представляющая имена классов, разделенные пробелом, или массив.

Изменить разметку, как показано ниже HTML

наценка

<table>
    <tr ng-repeat-start="item in data.group" ng-init="$index%2==0?(color='blue'): (color='red')">
        <td>{{item.name}}</td>            
        <tr ng-repeat-end ng-repeat="inner in item.innerdata" ng-class="color">
            <td>{{inner.innername}}</td>
        </tr>
    </tr>
</table>

скрипка

Обновление 1

Лучшее решение было бы использовать напрямую ng-class на внутренний нг-повтор

<table>
    <tr ng-repeat-start="item in data.group">
        <td>{{item.name}}</td>            
        <tr ng-repeat-end ng-repeat="inner in item.innerdata" ng-class="$parent.$index%2 == 0? 'red': 'blue'">
            <td>{{inner.innername}}</td>
        </tr>
    </tr>
</table>

Обновлено 1

Обновление 2

Более точное решение будет использовать $even или же $odd объект $parent

<table>
    <tr ng-repeat-start="item in data.group">
        <td>{{item.name}}</td>            
        <tr ng-repeat-end ng-repeat="inner in item.innerdata" ng-class="$parent.$even? 'red': 'blue'">
            <td>{{inner.innername}}</td>
        </tr>
    </tr>
</table>

Обновление 2