For konstrukcija Angular

Ciklą per masyvo elementus taip pat galima paleisti naudojant konstrukciją @for.

Išbandykime praktiškai. Tarkime, mūsų komponente vėl yra masyvas:

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

Apžvelkime konstrukcijos sintaksę:

@for () {
	ženklai
}

Nurodykime išvardinamą masyvą ir kintamąjį, į kurį pateks elementai:

@for (elem of arr) {
	ženklai
}

Tačiau tai dar ne viskas. Kad Angular veiktų teisingai, privalome nurodyti specialią komandą track. Po jos privalome nurodyti kokią nors unikalią reikšmę kiekvienam masyvo elementui. Tai reikalinga, kad Angular galėtų optimaliau dirbti su DOM. Paimkime kaip tokią unikalią reikšmę masyvo elemento numerį. Tam privalome nurodyti kintamąjį $index. Taigi, štai mūsų galutinis kodas:

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

Duotas masyvas:

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

Išveskite kiekvieną šio masyvo elementą atskiroje pastraipoje.