Reaktivita v Angular

Při jakýchkoli změnách veřejných vlastností šablona bude reagovat reaktivně, tedy se okamžitě měnit. Tak funguje reaktivita v Angular.

Podívejme se na příklad. Předpokládejme, že máme vlastnost obsahující text:

app/app.component.tsexport class AppComponent {
  public text: string = '';
}

Vypišme naši vlastnost v nějakém tagu:

app/app.component.html<div>
  {{ text }}
</div>

Nyní vytvořme tlačítko, na jehož kliknutí se bude volat metoda třídy:

app/app.component.html<button (click)="show()">
  show
</button>

V této metodě změníme text:

app/app.component.tsexport class AppComponent {
  public text: string = '';
  
  public show(): void {
    this.text = 'hello';
  }
}

Nyní, pokud kód spustíme a stiskneme tlačítko, text v divu se změní ihned po stisknutí.