ng generate module customers --routing
ng generate module orders --routing

ng generate component customers/customer-list
ng generate component orders/order-list

<h1>
  {{title}}
</h1>

<button routerLink="/customers">Customers</button>
<button routerLink="/orders">Orders</button>
<button routerLink="">Home</button>

<router-outlet></router-outlet>

ng serve

const routes: Routes = [
  {
    path: 'customers',
    loadChildren: './customers/customers.module#CustomersModule'
  },
  {
    path: 'orders',
    loadChildren: './orders/orders.module#OrdersModule'
  },
  {
    path: '',
    redirectTo: '',
    pathMatch: 'full'
  }
];

<ul>
  <li>customer 1</li>
  <li>customer 2</li>
  <li>customer 3</li>
  <li>customer 5</li>
</ul>

import { CustomerListComponent } from './customer-list/customer-list.component';


const routes: Routes = [
  {
    path: '',
    component: CustomerListComponent
  }
];

<ul>
  <li>order 1</li>
  <li>order 2</li>
  <li>order 3</li>
  <li>order 5</li>
</ul>

import { OrderListComponent } from './order-list/order-list.component';

const routes: Routes = [
  {
    path: '',
    component: OrderListComponent
  }
];

@NgModule({
  imports: [
    RouterModule.forRoot(routes, {
      enableTracing: true, // <-- debugging purposes only
      preloadingStrategy: PreloadAllModules
    })
  ],
  exports: [RouterModule]
})
export class AppRoutingModule { }

```

ng generate service selective-preloading-strategy

import { Injectable } from '@angular/core'; import { PreloadingStrategy, Route } from '@angular/router'; import { Observable, of } from 'rxjs';

@Injectable({ providedIn: 'root', }) export class SelectivePreloadingStrategyService implements PreloadingStrategy { preloadedModules: string[] = [];

preload(route: Route, load: () => Observable): Observable { if (route.data && route.data['preload']) { // add the route path to the preloaded module array this.preloadedModules.push(route.path);

  // log the route path to the console
  console.log('Preloaded: ' + route.path);

  return load();
} else {
  return of(null);
}

} }

@NgModule({ imports: [ RouterModule.forRoot(routes, { enableTracing: true, // <-- debugging purposes only preloadingStrategy: SelectivePreloadingStrategyService }) ], exports: [RouterModule] })