Mengenal Directive: ngClass
Apa dan bagaimana ngClass itu?
Tutorial kali ini adalah tentang directive: ngClass. Fungsi directive ini adalah mengubah class-nya HTML elements.
Sama seperti ngClass, ngStyle juga termasuk dalam attribute directive dimana ia tidak membuat atau menghapus element namun hanya mengubah element tempat ia berada.
Persiapan
Pembuatan project baru
Adapun project yang digunakan dalam tutorial kali ini mengambil dari tutorial sebelumnya tentang ngClass.
Pembuatan CSS Class
Buka file server.component.ts, edit seperti ini:

Fokus pada line 6–9 dimana kita membuat 2 CSS class yang nanti akan digunakan saat pendeklarasian ngClass. Dari tutorial sebelumnya kita sudah mengenal cara pembuatan style component seperti ini disebut inline styling.
Isi template component
Buka file server.component.html, lalu jadikan seperti ini:

Fokus pada line 3, disanalah kita mengatur CSS class apa yang harus diterapkan saat suatu kondisi terpenuhi.
Hasil Akhir
Jalankan “ng serve”, buka browser, lalu lakukan refresh berulang-ulang. Anda akan dapati tampilan yang berubah-ubah seperti ini:

Atribusi Anda berupa clapping, sharing, ngasih komentar, dan following blog ini dapat menimbulkan efek samping berupa semangat menulis yang menggebu bagi saya

