Untuk membuat route di Angular, pertama-tama Anda perlu menginstal dan mengimport Angular Router ke aplikasi Anda.
- Instal Angular Router dengan menjalankan perintah
npm install @angular/router
atauyarn add @angular/router
di terminal Anda. - Import Angular Router ke aplikasi Anda dengan menambahkan baris ini di bagian atas file app.module.ts:
- Buat sebuah array yang berisi objek-objek route yang akan digunakan dalam aplikasi Anda. Setiap objek route memiliki properti path yang menentukan URL yang akan dihandle oleh route tersebut, dan component yang menentukan komponen Angular yang akan ditampilkan saat route tersebut diakses. Misalnya:
- Tambahkan array route yang telah dibuat ke dalam metode
imports
dari objek@NgModule
di file app.module.ts. Juga tambahkanRouterModule.forRoot(appRoutes)
sebagai salah satu item di dalam arrayimports
. - Tambahkan element
<router-outlet>
ke dalam template komponen yang akan menjadi "shell" aplikasi Anda, di mana konten dari komponen yang dihandle oleh route akan ditampilkan. Misalnya:
Setelah mengikuti langkah-langkah di atas, Anda sudah dapat membuat dan mengelola route di Angular. Semoga membantu!