Skip to content

@for

@for replaces *ngFor with required track and built-in @empty support.

@for (product of products; track product.id) {
<div>{{ product.name }}</div>
} @empty {
<p>No products found.</p>
}
// Local variables
@for (item of items; track item.id; let i = $index, first = $first) {
<div [class.highlight]="first">{{ i }}. {{ item.name }}</div>
}

@for is faster and more explicit than *ngFor.”