Angular Reactive Forms – 6

Pada modul ini kita akan belajar menambahkan form control secara dinamis. Skenarionya adalah user dapat menambahkan informasi hobbies (dapat lebih dari satu hobby). Untuk itu kita akan gunakan FormArray untuk menyimpan array of form control. Buka file app.component.ts, lalu tambahkan: key-value pada form object untuk menyimpan data hobbies. method untuk handling ketika user menekan add … Read more

Sharing is caring:

Angular Reactive Forms – 5

Melanjutkan modul sebelumnya, kali ini akan dibahas penggunaan form grouping. Form Grouping berguna jika form yang dibuat cukup complex. Salah satu keuntungan menggunakan grouping, dapat melakukan validasi berdasarkan grouping. Skenarionya, kita akan lakukan grouping username dan email, menjadi satu form group, misalnya userData. Buka file app.component.ts, lalu ubah code dengan menambahkan formGroup untuk control yang … Read more

Sharing is caring:

Angular Reactive Forms – 4

Melanjutkan modul sebelumnya, kita akan membahas validasi form. Pada modul sebelumnya, saat mendefinisikan form control, kita hanya mengisi argument default value. Disini kita akan tambahkan argument validasi. KIta dapat menggunakan default validator yang disediakan oleh Angular. Perhatikan, kita dapat menggunakan lebih dari satu validator dengan mengisi argumen dengan array of validators. Perhatian penggunaan method getter … Read more

Sharing is caring:

Angular Reactive Forms – 3

Melanjutkan dari modul sebelumnya, sekarang kita akan membahas submit form. Buka file app.component.html, tambahkan event binding untuk ngSubmit directive. Perbedaan dengan pendekatan template driven, kita tidak perlu menggunakan local reference. Kemudian buka file app.component.ts, tambahkan method onSubmit() untuk handling submit form. Berikut isi lengkap file app.component.html file app.component.ts Sesuai ekspektasi, form template sudah terhubung dengan … Read more

Sharing is caring: