Membuat Custom Directive – Part 4

Selain menggunakan renderer yang telah dibahas pada modul sebelumnya. Pada modul ini kita bisa melakukan hal yang sama dengan menggunakan dekorator @HostBinding. Penggunaan HostBinding umumnya digunakan untuk property binding. Jika directive yang Anda buat sederhana, seperti contoh tutorial, sangat cocok digunakan. HostBinding memerlukan parameter property yang akan di-bind, pada kasus modul ini adalah ‘style.backgroundColor’. Perhatikan, … Read more

Sharing is caring:

Membuat Custom Directive – Part 3

Tentu akan lebih menarik jika directive yang dibuat lebih intuitif. Misalnya warna diubah ketika terjadi even mouse over. Untuk itu kita gunakan decorator HostListener, yang berguna mengakses event yang terjadi pada element. Buka file adv-highlight.directive.ts, tambahkan code berikut Parameter pada @HostListener, yaitu: mouseenter dan mouseleave adalah event standard. Sementara mouseover(eventData: Event) dan mouseleave(eventData: Event) adalah … Read more

Sharing is caring:

Membuat Custom Directive – Part 2

Angular tidak hanya dapat berjalan di browser, tapi bisa juga digunakan dalam service worker. Dimana ada kemungkinan tidak bisa mengakses DOM. Pada modul sebelumnya, directive mengakses DOM secara langsung. Pendekatan ini tidak disarankan, karena alasan diatas. Angular menyediakan tool helper yaitu renderer, dimana kita bisa render object HTML tanpa mengakses DOM. Buat file directive baru, … Read more

Sharing is caring:

Membuat Custom Directive – Part 1

Angular directive sudah dibahas pada modul Pengenalan Angular Directive, disana dibahas terdapat Built-in Directive seperti ngFor, ngIf, ngClass dan ngStyle. Pada modul ini kita akan membahas membuat custom directive. Skenarionya Directive yang kita buat akan mengubah warna background sebuah element. Ya, betul itu dapat dilakukan dengan mudah melalui CSS atau menggunakan Built-in Directive. Skenario ini … Read more

Sharing is caring: