Reaktivnost v Angularju

Ob kakršnih koli spremembah javnih lastnosti, se bo predloga odzvala reaktivno, to je takoj spremenila. Tako deluje reaktivnost v Angularju.

Poglejmo si primer. Naj imamo lastnost, ki vsebuje besedilo:

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

Izpišimo našo lastnost v kateremkoli tagu:

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

Zdaj naredimo gumb, ob kliku na katerega se bo klicala metoda razreda:

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

V tej metodi spremenimo besedilo:

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

Zdaj, če zaženemo kodo in pritisnemo na gumb, se bo besedilo v divu spremenilo takoj po kliku.