Reaktywność w Angular
Przy każdej zmianie publicznych właściwości, szablon zareaguje reaktywnie, czyli natychmiast się zmieni. Tak działa reaktywność w Angular.
Spójrzmy na przykład. Załóżmy, że mamy właściwość zawierającą tekst:
export class AppComponent {
public text: string = '';
}
Wyświetlmy naszą właściwość w jakimś tagu:
<div>
{{ text }}
</div>
Teraz zróbmy przycisk, po kliknięciu którego będzie wywoływana metoda klasy:
<button (click)="show()">
show
</button>
W tej metodzie zmieńmy tekst:
export class AppComponent {
public text: string = '';
public show(): void {
this.text = 'hello';
}
}
Teraz, jeśli uruchomimy kod i naciśniemy przycisk, to tekst w divie zmieni się natychmiast po naciśnięciu.
Zrób diva i dwa przyciski. Spraw, aby po naciśnięciu pierwszego przycisku w divie pojawił się jeden tekst, a po naciśnięciu drugiego - inny tekst.
