AngularJS: API: ng/directive/ngClassOdd


ngClassOdd

  1. - directive in module ng

The ngClassOdd and ngClassEven directives work exactly as ngClass, except they work in conjunction with ngRepeat and take effect only on odd (even) rows.

This directive can be applied only within the scope of an ngRepeat.

Directive Info

  • This directive executes at priority level 0.

Usage

  • as attribute: 
    <ANY
  ng-class-odd="">
...
</ANY>
  • as CSS class: 
    <ANY class="ng-class-odd: ;"> ... </ANY>

Arguments

ParamTypeDetails
ngClassOddexpression

Expression to eval. The result of the evaluation can be a string representing space delimited class names or an array.

Example

protractor.js
<ol ng-init="names=['John', 'Mary', 'Cate', 'Suz']">
  <li ng-repeat="name in names">
   <span ng-class-odd="'odd'" ng-class-even="'even'">
     {{name}}
   </span>
  </li></ol>
style.css
.odd {
  color: red;}.even {
  color: blue;}
index.html
it('should check ng-class-odd and ng-class-even', function() {
  expect(element(by.repeater('name in names').row(0).column('name')).getAttribute('class')).
    toMatch(/odd/);
  expect(element(by.repeater('name in names').row(1).column('name')).getAttribute('class')).
    toMatch(/even/);});