Անգուլարում ռեակտիվ ցիկլերը
Ռեակտիվությունը նաև կաշխատի
ngFor ցիկլում: Սա նշանակում է, որ զանգվածի
փոփոխությունները անմիջապես կարտացոլվեն
էկրանին:
Եկեք փորձենք գործնականում: Ենթադրենք ունենք հետևյալ զանգվածը:
export class AppComponent {
public arr: string[] = ['a', 'b', 'c', 'd'];
}
Եկեք ցուցադրենք մեր զանգվածը ցիկլում որպես ցուցակ:
<ul>
<li *ngFor="let elem of arr">
{{ elem }}
</li>
</ul>
Ստեղծենք կոճակ, որի սեղմումով կկանչվի դասի մեթոդը:
<button (click)="add()">
add
</button>
Այս մեթոդում ինչ-որ կերպ կփոխենք մեր զանգվածը, օրինակ, կավելացնենք նոր տարր.
export class AppComponent {
public text: string = '';
public add(): void {
this.arr.push('!');
}
}
Այժմ, եթե գործարկենք կոդը և սեղմենք կոճակը, ապա սեղմումից անմիջապես հետո ցուցակում կհայտնվի նոր տարր:
Տրված է զանգված: Ցուցադրեք դրա տարրերը ցիկլում: Ստեղծեք կոճակ, որի սեղմումով զանգվածից կհեռացվի վերջին տարրը:
