Ciklet Reaktive në Angular

Reaktiviteti do të funksionojë gjithashtu në ciklin ngFor. Kjo do të thotë se kur ndryshohet array, këto ndryshime do të shfaqen menjëherë në ekran.

Le ta provojmë në praktikë. Le të themi se kemi array-n e mëposhtëm:

export class AppComponent {
	public arr: string[] = ['a', 'b', 'c', 'd'];
}

Le të shfaqim array-n tonë në një cikël si një listë:

<ul>
	<li *ngFor="let elem of arr">
		{{ elem }}
	</li>
</ul>

Le të krijojmë një buton, upon clicking on which do të thirret një metodë e klasës:

<button (click)="add()">
	add
</button>

Në këtë metodë, le të ndryshojmë array-n tonë në një farë mënyre, për shembull, duke shtuar një element të ri në të:

export class AppComponent {
	public text: string = '';
	
	public add(): void {
		this.arr.push('!');
	}
}

Tani, nëse e ekzekutoni kodin dhe klikoni në buton, menjëherë pas klikimit në listë do të shfaqet një element i ri.

Jepet një array. Shfaqni elementët e saj në një cikël. Krijoni një buton, upon clicking on which the do të fshihet elementi i fundit nga array.