angular路由详解五（辅助路由）

在HTML文件中

//主路由

<router-outlet></router-outlet>

//辅助路由

<router-outlet  name="aux"></router-outlet>

 

配置

{path:'xxx',component:XxxComponent}

{path:'yyy',component:YyyComponent,outlet:"aux"}

 

<a [routerLink] = "['/xxx',{outlet:{aux:'xxx'}}]">Xxx</a>

<a [routerLink] = "['/yyy',{outlet:{aux:'yyy'}}]">Yyy</a>

//primary   决定主路由的路径  点击a标签主路由到Zzz组件，辅助路由到Yyy组件

<a [routerLink] = "['/yyy',{outlet:{primary:‘zzz’ aux:'yyy'}}]">Yyy</a>