Konstrukcija for v Angularju

Zanko po elementih polja lahko zaženemo tudi s konstrukcijo @for.

Poskusimo v praksi. Naj ima spet naš komponent polje:

export class AppComponent {
	public arr: number[] = [1, 2, 3, 4, 5];
}

Oglejmo si sintakso konstrukcije:

@for () {
	oznake
}

Določimo polje, ki ga preiskujemo, in spremenljivko, v katero bodo prišli elementi:

@for (elem of arr) {
	oznake
}

Vendar to še ni vse. Za pravilno delovanje Angularja moramo določiti poseben ukaz track. Za njim moramo določiti neko edinstveno vrednost za vsak element polja. To je potrebno, da lahko Angular deluje bolj optimalno z DOM. Vzemimo za to edinstveno vrednost številko elementa polja. Za to moramo določiti spremenljivko $index. Torej, tu je naša končna koda:

@for (elem of arr; track $index) {
	<div>
		{{ elem }}
	</div>
}

Dano polje:

export class AppComponent {
	public arr: numbers[] = [1, 2, 3, 4, 5];
}

Izpišite vsak element tega polja v ločenem odstavku.