Reaktivitas di Angular
Pada setiap perubahan properti publik, template akan bereaksi secara reaktif, yaitu berubah secara instan. Begitulah cara kerja reaktivitas di Angular.
Mari kita lihat sebuah contoh. Misalkan kita memiliki sebuah properti yang berisi teks:
export class AppComponent {
public text: string = '';
}
Tampilkan properti kita di dalam tag tertentu:
<div>
{{ text }}
</div>
Sekarang buat sebuah tombol, yang ketika diklik akan memanggil metode kelas:
<button (click)="show()">
show
</button>
Dalam metode ini, ubah teksnya:
export class AppComponent {
public text: string = '';
public show(): void {
this.text = 'hello';
}
}
Sekarang, jika kode dijalankan dan tombol ditekan, maka teks dalam div akan berubah segera setelah penekanan.
Buat sebuah div dan dua tombol. Buat agar ketika tombol pertama ditekan, satu teks muncul di div, dan ketika tombol kedua ditekan - teks lainnya muncul.