Réactivité dans Angular
Lors de tout changement des propriétés publiques, le template réagira de manière réactive, c'est-à-dire qu'il se modifiera instantanément. C'est ainsi que fonctionne la réactivité dans Angular.
Regardons un exemple. Supposons que nous ayons une propriété contenant du texte :
export class AppComponent {
public text: string = '';
}
Afficherons notre propriété dans une balise :
<div>
{{ text }}
</div>
Maintenant, créons un bouton sur lequel un clic appellera une méthode de la classe :
<button (click)="show()">
show
</button>
Dans cette méthode, modifions le texte :
export class AppComponent {
public text: string = '';
public show(): void {
this.text = 'hello';
}
}
Maintenant, si vous exécutez le code et cliquez sur le bouton, le texte dans la div changera immédiatement après le clic.
Créez une div et deux boutons. Faites en sorte qu'un clic sur le premier bouton insère un texte dans la div, et un clic sur le second - un autre texte.
