ngFor Directive using for show list data.
—-html file (user.component)
<table class="table"> <tbody> <tr *ngFor="let user of list;"> <td>{{user.name}}</td> <td>{{user.joining_date}}</td> <td>{{user.age}}</td> </tr> </tbody> </table>
—-html file (user.component)
list = [{ name: "Jon", joining_date:"23/10/2015", age: 23 }, { name:"Viki", joining_date:"24/01/2015", age: 20 }, { name: "Abc", joining_date:"25/10/2015", age: 43 },{ name: "XYZ", joining_date:"28/10/2015", age: 21 }];
Getting the Index when using ngFor
—-html file (user.component)
<table class="table"> <tbody> <tr *ngFor="let user of list; let i = index"> <td>{{i}}</td> <td>{{user.name}}</td> <td>{{user.joining_date}}</td> <td>{{user.age}}</td> </tr> </tbody> </table>