Reaktivne zanke v Angular
Reaktivnost bo delovala tudi v zanki
ngFor. To pomeni, da se bodo spremembe
v tabeli takoj odrazile
na zaslonu.
Poskusimo v praksi. Naj imamo naslednjo tabelo:
export class AppComponent {
public arr: string[] = ['a', 'b', 'c', 'd'];
}
Izpišimo našo tabelo v zanki kot seznam:
<ul>
<li *ngFor="let elem of arr">
{{ elem }}
</li>
</ul>
Naredimo gumb, ob kliku na katerega bo poklicana metoda razreda:
<button (click)="add()">
add
</button>
V tej metodi bomo na nek način spremenili našo tabelo, na primer, dodali ji bomo nov element:
export class AppComponent {
public text: string = '';
public add(): void {
this.arr.push('!');
}
}
Zdaj, če zaženemo kodo in kliknemo na gumb, se bo takoj po kliku na seznamu pojavil nov element.
Podana je tabela. Izpišite njene elemente v zanki. Naredite gumb, ob kliku na katerega bo iz tabele odstranjen zadnji element.
