Skip to main content

Routing

App with lazy-loaded module​

app-routing.module.ts

const routes: Routes = \[
  { path: 'dashboard', component: MainDashboardComponent },
  { path: 'rooms', loadChildren: './rooms.module#RoomsModule' },
  { path: '', redirectTo: 'dashboard', pathMatch: 'full' }
\];

rooms-routing.module.ts

This module will load when the app’s router inspects <app-base-url>/rooms.

const routes: Routes = \[
  {
    path: '',
    component: RoomsDashboardComponent,
    children: \[
      { path: 'dining-room', component: DiningRoomComponent }
      { path: 'living-room', component: LivingRoomComponent }
      { path: 'kitchen', component: KitchenComponent }
      { path: '', component: HomeComponent }
    \]
  }
\];