Reaktīvie cikli Angular
Reaktivitāte darbosies arī ciklā
ngFor. Tas nozīmē, ka, mainoties
masīvam, šīs izmaiņas uzreiz atspoguļosies
ekrānā.
Izmēģināsim to praksē. Pieņemsim, ka mums ir šāds masīvs:
export class AppComponent {
public arr: string[] = ['a', 'b', 'c', 'd'];
}
Attēlosim mūsu masīvu ciklā saraksta veidā:
<ul>
<li *ngFor="let elem of arr">
{{ elem }}
</li>
</ul>
Izveidosim pogu, uz kuras noklikšķinot tiks izsaukta klases metode:
<button (click)="add()">
add
</button>
Šajā metodē kaut kā mainīsim mūsu masīvu, piemēram, pievienosim tam jaunu elementu:
export class AppComponent {
public text: string = '';
public add(): void {
this.arr.push('!');
}
}
Tagad, ja palaidīsim kodu un nospiedīsim uz pogas, tad uzreiz pēc nospiešanas sarakstā parādīsies jauns elements.
Dots masīvs. Izvadiet tā elementus ciklā. Izveidojiet pogu, kuras nospiežot no masīva tiks dzēsts pēdējais elements.
