StackOverflow_23111349: similar-to-nth-childeven-for-a-ul

Illustration of answer to http://stackoverflow.com/questions/23111349/similar-to-nth-childeven-for-a-ul.

by ExpertSystem

HTML

<script src="http://code.angularjs.org/1.2.16/angular.min.js"></script>
<div ng-controller="myCtrl">
    <h2>Using <b>ngClass</b>:</h2>
    <ul>
        <li ng-class="{'even':$odd}" ng-repeat="item in items">
            {{item.description}}
        </li>
    </ul>

    <hr />
    
    <h2>Using <b>ngClassEven</b>:</h2>
    <ul>
        <li ng-class-even="'even'" ng-repeat="item in items">
            {{item.description}}
        </li>
    </ul>
</div>

CSS

li:after {
    color: Gray;
}

li.even:after {
    content: '<- even';
}

JavaScript

var app = angular.module('myApp', []);
app.controller('myCtrl', function ($http, $scope) {
    $scope.items = [
        {id: 1, description: 'item 01'},
        {id: 2, description: 'item 02'},
        {id: 4, description: 'item 03'},
        {id: 4, description: 'item 04'},
        {id: 5, description: 'item 05'}
    ];
});