Angular 17 for loop example | @for block - Repeaters | track expression | @empty block

Angular 17 Tutorial:-
*********************

From Angular 17, @for block - Repeaters:
The @for repeatedly renders the content of a block for each item in a collection. The collection can be represented as any JavaScript alterable but there are performance advantages of using a regular Array.

A basic @for loop looks like:
}
What Is ‘track’?
The track setting replaces NgFor's concept of a trackBy function.
The value of the ‘track’ expression determines a key used to associate array items with the views in the DOM.
Built-in control flow and the NgIf, NgSwitch and NgFor structural directives:
1. The @if block replaces *ngIf for expressing conditional parts of the UI.
2. The @switch block replaces ngSwitch with major benefits.
3. The @for block replaces *ngFor for iteration, and has several differences compared to its structural directive NgFor predecessor.
4. The track setting replaces NgFor's concept of a trackBy function.

These variables are always available with these names, but can be aliased via a let segment:
}

The @empty block:
You can optionally include an @empty section immediately after the @for block content.

The content of the @empty block displays when there are no items:
A basic @empty block looks like:
} @empty {
There are no items.
}