АКЦИЯ: бесплатные месячные курсы по созданию сайтов
на выбор: верстка, JavaScript, PHP или фреймворки. Сегодня последний день для записи! Жми!
⊗jsagPmLpLI 32 of 97 menu
НОВИНКА: Практика на Реальных Проектах и Работы в Портфолио. Бесплатный курс! Жми для записи!

Индексы итераций циклов в 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']; }

Выведите его номера, но так, чтобы они начинались с единицы, а не с нуля.

enru