Iterations indeks for loops i Angular
Ved gennemløb med *ngFor og @for
kan man få ikke kun elementerne i arrayet,
men også deres numre. Lad os se, hvordan dette
gøres. Lad os sige, at vi har et array i hovedkomponenten:
export class AppComponent {
public arr: string[] = ['a', 'b', 'c', 'd'];
}
Lad os udskrive både dens elementer og numre.
For direktivet *ngFor bruges
en speciel smart tilgang til dette:
<ul>
<li *ngFor="let el of arr; let i = index">
{{ i }}
{{ el }}
</li>
</ul>
Og for konstruktionen @for kan man bare
tage og bruge denne variabel inde i
loopet:
<ul>
@for (el of arr; track $index) {
<li>
{{ $index }}
{{ el }}
</li>
}
</ul>
Givet et array:
export class AppComponent {
public arr: string[] = ['a', 'b', 'c', 'd'];
}
Udskriv dens numre, men sådan at de starter fra et, og ikke fra nul.