Iteratie-indexen van loops in Angular
Bij het itereren met *ngFor en @for
kun je niet alleen de elementen van de array krijgen,
maar ook hun indexen. Laten we kijken hoe dit
gedaan wordt. Stel dat we in de hoofdcomponent
een array hebben:
export class AppComponent {
public arr: string[] = ['a', 'b', 'c', 'd'];
}
Laten we zowel zijn elementen als indexen weergeven.
Voor de directive *ngFor wordt hiervoor
een speciale slimme truc gebruikt:
<ul>
<li *ngFor="let el of arr; let i = index">
{{ i }}
{{ el }}
</li>
</ul>
En voor de constructie @for kun je simpelweg
deze variabele binnen de loop gebruiken:
<ul>
@for (el of arr; track $index) {
<li>
{{ $index }}
{{ el }}
</li>
}
</ul>
Gegeven een array:
export class AppComponent {
public arr: string[] = ['a', 'b', 'c', 'd'];
}
Geef zijn indexen weer, maar zodanig dat ze beginnen met één, en niet met nul.
