( 在项目目录下使用命令行工具)
1. ng g module confirm-order --routing
2. ng g component confirm-order
(注意顺序,先创建module,然后增加组件时angular-cli会自动将component导入到module中)
3. 配置路由confirm-order-routing.module.ts
const routes: Routes = [{path: '',component: ConfirmOrderComponent, data: { title: '确认订单' }}];
4.配置路由app-routing.module.ts
const routes: Routes = [{path: '',redirectTo: 'home',pathMatch: 'full'},{path: 'home',loadChildren: './home/home.module#HomeModule'},{path: 'confirm-order',loadChildren: './confirm-order/confirm-order.module#ConfirmOrderModule'}];
最后附上部分截图:
图1. 项目结构
图2. ConfirmOrderModule模块
图3. ConfirmOrderRoutingModule路由模块
图4. AppRoutingModule路由模块