alternate-row-color-using-angularjs

To represent our data or any element on HTML page, we generally use tables and there are several ways to make these table with a better design.

Here is an example of alternate row in table using AngularJs, also it is a simple example of ng-repeat. The flow is quiet easy, firstly we will define our row colors in CSS and will give the classes specific names say .odd and .even as follows:

By using ng-class-odd & ng-class-even we will assign the classes to alternate even and odd rows along with ng-repeat function in tr tag as follows:

Complete code example:

–Alternate row color in table using AngularJs–