Индекси на итерации на цикли в Angular
При обхождане чрез *ngFor и @for
може да се получават не само елементите на масива,
но и техните номера. Нека да видим как се
прави това. Да предположим, че в главния компонент
имаме масив:
export class AppComponent {
public arr: string[] = ['a', 'b', 'c', 'd'];
}
Нека изведем както неговите елементи, така и номерата им.
За директивата *ngFor за това се
използва специална хитра уловка:
<ul>
<li *ngFor="let el of arr; let i = index">
{{ i }}
{{ el }}
</li>
</ul>
А за конструкцията @for може просто
да се вземе и използва тази променлива вътре
в цикъла:
<ul>
@for (el of arr; track $index) {
<li>
{{ $index }}
{{ el }}
</li>
}
</ul>
Даден е масив:
export class AppComponent {
public arr: string[] = ['a', 'b', 'c', 'd'];
}
Изведете номерата му, но така, че те да започват от единица, а не от нула.