angular 中父子路由

1. 创建组件引入组件

import { NewsaddComponent } from './components/newsadd/newsadd.component';
import { NewslistComponent } from './components/newslist/newslist.component';

2. 配置路由

{
    path: 'news',
    component:NewsComponent,
    children: [
     {
       path:'newslist',
       component:NewslistComponent
}, {
       path:'newsadd',
       component:NewsaddComponent
} ]
}

3. 父组件中定义 router-outlet

 <router-outlet></router-outlet>

如：

 <div class="content">

   <div class="left">

       <a [routerLink]="[ '/home/homechild1']" routerLinkActive="active">   homechild1</a>

       <br>

       <br>
       <a [routerLink]="[ '/home/homechild2']" routerLinkActive="active">   homechild2</a>

   </div>

   <div class="right">

     <router-outlet></router-outlet>

   </div>

 </div>

注意：子路由前要加父路由路径