Tutorialspoint examples

Learn java tutorial with examples for beginners online

Angularjs get table row index example

Angularjs get table row index:

The $index object is used to get table row index. Initial value of $index is 0.



Example explanation:

The ng-app directive initializes the application. We create a students object which is initialized by ng-init directive using JSON syntax. The ng-repeat directive will work as for-each loop and iterates over students object. The {{$index}} display the table row index.


    <title>AngularJS Table Row Index Example</title>    
    <script src=
     table, th , td {
      border: 1px solid grey;
      border-collapse: collapse;
      padding: 5px;
     table tr:nth-child(odd) {
      background-color: #f2f2f2;
     table tr:nth-child(even) {
      background-color: #ffffff;
      <h1>AngularJS Table Row Index Example.</h1>
      <div ng-app = "" 
           ng-init = "students=[{name:'Prabhjot',country:'US'},
         <p>Students with country name:</p>
                   <th>Sr. No.</th>
              <tr ng-repeat = "student in students">
                 <td>{{ $index + 1 }}</td>
                 <td>{{ student.name }}</td>
                 <td>{{ student.country }}</td>

Try it:

AngularJS Table Row Index Example on jsbin.com

Download tutorialspointexamples Android App
Copyright © 2018 Tutorialspoint examples DMCA.com Protection Status