Angular02

Melanjutkan dari modul sebelumnya, menu yang baru ditambahkan, bila kita melakukan navigasi, akan hilang. Hal ini terjadi karena Recipe Service diregistrasikan pada level component. Hal ini cukup mudah diselesaikan. Pertama buang registrasi service pada level component. Buka file recipes.component.ts, ubah menjadi code seperti dibawah dengan membuang registrasi recipe service. Buka file app.module.ts, lalu tambahkan recipe … Read more

Pada modul ini kita akan mengaktifkan beberapa fitur: Delete recipe pada form Recipe List. Pada form Edit Recipe, menambahkan navigasi pada button cancel, save dan delete ingredient. Menampilkan image preview pada Edit Recipe. Fungsi Delete Recipe Buka file recipe.service.ts, kita tambahkan method untuk handling delete. Kemudian buka file recipe-detail.component.html, pada delete button tambahkan code berikut … Read more

Pada modul ini kita akan melakukan form submit. Untuk kesederhanaan tutorial, data yang diterima dari form akan ditambahkan pada array recipe. Pada praktek real aplikasi, tentu akan disimpan kedalam database. Untuk menambahkan data kedalam array, kita perlu tambahkan method save pada recipe service. Selain itu kita perlu menambahkan Subject sebagai event listener ketika isi recipe … Read more

Pada modul ini kita akan mengimplementasikan validasi pada form. Sengaja kami pisahkan agar tutorial menjadi lebih mudah dipahami. Buka file recipe-edit.component.ts, kita akan gunakan validator built-in dari Angular. (lihat code dengan bagian comment) Berikutnya kita buka recipe-edit.component.html, lalu implementasikan validasi yang sudah tersedia. Kemudian buka file recipe-edit.component.css, untuk menambahkan css rule untuk element form yang … Read more