Skip to main content

angular - Loop through an array of objects

app.component.ts 

import { Component } from '@angular/core';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})

export class AppComponent {
  students = [
    {name:'Jenny',email:'jenny@example.com',age:21},
    {name:'Jones',email:'jones@example.com',age:22},
    {name:'Raymond',email:'raymond@example.com',age:19},
    {name:'Annee',email:'annee@example.com',age:24}
  ];
}
app.component.html 

<h2>Angular Loop Array Of Objects</h2>

<div *ngFor="let student of students">
    <h3>
        {{student.name}} : {{student.email}} : {{student.age}}
    </h3>
</div>
More Angular tutorials
Labels: