Templat dan Pengikatan Data

Interpolasi membolehkan anda memasukkan nilai daripada komponen ke dalam HTML. Gunakan pendakap keriting berganda untuk memaparkan data:

{{ data }}

{{ username }}

Pengikatan sifat membolehkan anda menetapkan sifat elemen HTML secara dinamik:

[src] = "imageUrl"

<img [src]="user.profilePicture">

Pengikatan peristiwa membolehkan aplikasi anda bertindak balas terhadap tindakan pengguna:

(click)="onClick()"

<button (click)="showAlert()">Click me</button>

Pengikatan dua hala memastikan antaramuka pengguna dan data anda disegerakkan. Gunakan [(ngModel)]:

<input [(ngModel)]="user.name">

Arahan struktur mengubah susun atur DOM. Contohnya termasuk *ngIf dan *ngFor.

<div *ngIf="isVisible">Visible Content</div>

*ngFor mengulangi data dan memaparkan elemen berulang kali:

<li *ngFor="let item of items">{{ item }}</li>

Anda telah belajar menggunakan templat dan pengikatan data untuk mencipta paparan Angular dinamik!