Data Binding dan Event

Menghubungkan data TypeScript ke template dan merespons interaksi pengguna.
30 menit

Interpolation

Interpolation menampilkan nilai dari class ke template dengan sintaks kurung kurawal ganda:

<h1>{{ courseTitle }}</h1>

Property Binding

Property binding mengirim nilai ke properti elemen HTML:

<button [disabled]="isCompleted">Mulai Belajar</button>

Event Binding

Event binding menjalankan method ketika pengguna melakukan suatu aksi:

<button (click)="completeSession()">Tandai Selesai</button>
export class CourseCardComponent {
  isCompleted = false;

  completeSession() {
    this.isCompleted = true;
  }
}

Latihan Sesi 3

Tambahkan tombol pada course-card. Saat tombol ditekan, ubah status sesi menjadi selesai dan nonaktifkan tombol tersebut.

Diskusi proyek? Chat via WhatsApp