Angular 22 · Components and templates
Loop over items
Use @for. The track expression is required and helps Angular reuse DOM elements.
@for (item of items; track item.id) {
<li>{{ item.name }}</li>
} @empty {
<li>No items.</li>
}
Official Angular 22 documentation
More components and templates commands
- Write a standalone component
- Pass data in and out
- Show content conditionally
- Handle an event
- Bind a property
- Toggle a CSS class
All components and templates commands · Angular 22 cheatsheet