<h1>Example: ngClassEven / ngClassOdd</h1>
<p>ngClassEvenはngRepeatと組み合わせて使い偶数行に対しての振る舞いを定義できます。ngClassOddは奇数業に対して振る舞いを定義します。</p>
<div ng-app>
  <ul ng-init="fruits=['Apple', 'Orange', 'Lemon', 'Green Apple', 'Blue Berry']">
    <li ng-repeat="fruit in fruits" ng-class-even="'even'" ng-class-odd="'odd'">{{ fruit }}</li>
  </ul>
</div>
@import "bourbon";

body {
  padding: 1.5rem;
}

.even {
  font-weight: bold;
}

.odd {
  color: red;
}
View Compiled

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

  1. //ajax.googleapis.com/ajax/libs/angularjs/1.3.2/angular.min.js