Reaktivitāte Angular

Izmantojot jebkādas izmaiņas publiskajos īpašības, veidne reaģēs reaktīvi, proti, acumirklī mainīsies. Tā darbojas reaktivitāte Angular.

Apskatīsim piemēru. Pieņemsim, ka mums ir īpašība, kas satur tekstu:

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

Parādīsim mūsu īpašību kādā tagā:

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

Tagad izveidosim pogu, uz kuras klikšķa tiks izsaukta klases metode:

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

Šajā metodē mainīsim tekstu:

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

Tagad, ja palaidīsim kodu un nospiedīsim uz pogas, tad uzreiz pēc nospiešanas mainīsies teksts divā.

Задание 1

Izveidojiet div un divas pogas. Izveidojiet tā, lai, nospiežot uz pirmās pogas, divā parādītos viens teksts, bet, nospiežot uz otrās - cits teksts.