Ευρετήρια επαναλήψεων βρόχων στο Angular

Κατά την επανάληψη μέσω *ngFor και @for μπορείτε να λαμβάνετε όχι μόνο τα στοιχεία του πίνακα, αλλά και τους αριθμούς τους. Ας δούμε πώς γίνεται αυτό. Ας υποθέσουμε ότι έχουμε έναν πίνακα στον κύριο component:

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'];
}

Εμφανίστε τους αριθμούς του, αλλά έτσι ώστε να ξεκινούν από το ένα, και όχι από το μηδέν.