IntermediateWeb Developmentintermediate

Structural: *ngFor

Relax. We'll talk through this in plain words — no textbook voice.

*ngFor directive loops through an array to render a list of elements.

typescript

<ul>
  <li *ngFor="let user of users">
    {{ user.name }} ({{ user.age }})
  </li>
</ul>

// component.ts
export class MyComponent {
  users = [
    { name: 'Alice', age: 30 },
    { name: 'Bob', age: 25 },
    { name: 'Charlie', age: 35 }
  ];
}

You should see

(A list showing the names and ages of 3 users will appear)