Child Routes

什么是子路由？

相对于某一路径开创一个独立的路由模块

设置方法

//在路由模块'departments/:id'路径下设置子路由，子路由下路径都是相对于该路径而设置的
{
    path:'departments/:id',component:DepartmentDetailComponent,
    children:[
      {path:'overview', component:DepartmentOverviewComponent},
      {path:'contact', component:DepartmentContactComponent}
    ]
  }
  export const routingComponents=[DepartmentListComponent,
                                EmployeeListComponent,
                                PageNotFoundComponent,
                                DepartmentDetailComponent,
                                DepartmentOverviewComponent,
                                DepartmentContactComponent]
//在DepartmentDetailComponent组件模板下添加router-outlet标签，添加button并绑定单击导航事件
<button (click)='showOverview()'>overview</button>
    <button (click)='showContact()'>contact</button>
    <router-outlet></router-outlet>
//相对导航
  showOverview(){
    this.route.navigate(['overview'], {relativeTo: this.router});
  }
  showContact(){
    this.route.navigate(['contact'], {relativeTo: this.router});
  }