Реактивност у Angular

При било каквим променама јавних својстава, темплејт ће реактивно реаговати, односно се тренутно мењати. Тако функционише реактивност у Angular-у.

Хајде да погледамо на примеру. Нека имамо својство које садржи текст:

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

Испишимо наше својство у неком тегу:

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

Сада направимо дугме, кликом на које ће се позивати метода класе:

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

У овој методи ћемо променити текст:

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

Сада, ако покренемо код и кликнемо на дугме, текст у div-у ће се променити одмах након клика.