Iterasjonsindekser for løkker i Angular
Ved iterering med *ngFor og @for
kan man ikke bare hente elementene i arrayen,
men også deres nummer. La oss se hvordan dette
gjøres. La oss si at vi har en array i hovedkomponenten:
export class AppComponent {
public arr: string[] = ['a', 'b', 'c', 'd'];
}
La oss vise både elementene og nummerene.
For direktivet *ngFor brukes
en spesiell, smart teknikk for dette:
<ul>
<li *ngFor="let el of arr; let i = index">
{{ i }}
{{ el }}
</li>
</ul>
Og for konstruksjonen @for kan man bare
bruke denne variabelen inni
løkken:
<ul>
@for (el of arr; track $index) {
<li>
{{ $index }}
{{ el }}
</li>
}
</ul>
Gitt arrayen:
export class AppComponent {
public arr: string[] = ['a', 'b', 'c', 'd'];
}
Vis nummerene, men slik at de starter på en, og ikke på null.