一些模块使用延迟加载后，只有当用户第一次导航到这个模块时，才会加载一些特性。这对于应用程序的性能和减小初始包的大小有很大的帮助。另外，设置非常简单。
延迟加载的路由需要在根应用程序模块之外，所以需要将惰性加载特性假如特性模块中。
$ ng g module shop
$ ng g c shop/cart
$ ng g c shop/checkout
$ ng g c shop/confirm
在主路由配置中，需要执行以下操作：
import { Routes } from ‘@angular/router‘;
// BoutiqueComponent is a normal, eager loaded component
import { BoutiqueComponent } from ‘./boutique/boutique.component‘;
export const routes: Routes = [
{ path: ‘‘, component: BoutiqueComponent, pathMatch: ‘full‘ },
{ path: ‘shop‘, loadChildren: ‘./shop/shop.module#ShopModule‘ },
{ path: ‘**‘, component: BoutiqueComponent }
];
上面使用了loadChildren，首先他通往模块的路径，然后#后面跟的是模块的类名。它指示路由器，模块应该是惰性加载，并告诉它在哪里找到模块。
剩下要做的就是配置特定于功能模块的路由：
import { Routes } from ‘@angular/router‘;
import { CartComponent } from ‘./cart/cart.component‘;
import { CheckoutComponent } from ‘./checkout/checkout.component‘;
import { ConfirmComponent } from ‘./confirm/confirm.component‘;
export const routes: Routes = [
{ path: ‘‘, component: CartComponent },
{ path: ‘checkout‘, component: CheckoutComponent },
{ path: ‘confirm‘, component: ConfirmComponent },
];
最后，在惰性模块中，使用RouterModule中得forChild替换forRoot。
import { NgModule } from ‘@angular/core‘;
import { CommonModule } from ‘@angular/common‘;
import { CartComponent } from ‘./cart/cart.component‘;
import { CheckoutComponent } from ‘./checkout/checkout.component‘;
import { ConfirmComponent } from ‘./confirm/confirm.component‘;
import { routes } from ‘./shop.routing‘;
import { RouterModule } from ‘@angular/router‘;
@NgModule({
imports: [
RouterModule.forChild(routes)
],
declarations: [CartComponent, CheckoutComponent, ConfirmComponent]
})
export class LegalModule { }
这就是它得全部。现在访问/shop,/shop/checkout这些模块将在第一次加载这些路径时加载。tip:假如不能立即生效，可以重启下sever。
惰性加载的一些问题可以在模块问题里找到。
