Reaktyvūs ciklai Angular
Reaktyvumas taip pat veiks cikle
ngFor. Tai reiškia, kad pakeitus
masyvą, šie pakeitimai iškart atsispindės
ekrane.
Išbandykime praktiškai. Tarkime, kad turime šį masyvą:
export class AppComponent {
public arr: string[] = ['a', 'b', 'c', 'd'];
}
Atvaizduokime savo masyvą cikle kaip sąrašą:
<ul>
<li *ngFor="let elem of arr">
{{ elem }}
</li>
</ul>
Sukurkime mygtuką, kurį paspaudus bus iškviečiamas klasės metodas:
<button (click)="add()">
add
</button>
Šiame metode kaip nors pakeisime savo masyvą, pavyzdžiui, pridėsime į jį naują elementą:
export class AppComponent {
public text: string = '';
public add(): void {
this.arr.push('!');
}
}
Dabar, jei paleisite kodą ir paspausite mygtuką, tuoj po paspaudimo sąraše pasirodys naujas elementas.
Duotas masyvas. Atvaizduokite jo elementus cikle. Padarykite mygtuką, kurį paspaudus iš masyvo bus pašalinamas paskutinis elementas.
