angular – 辅助路由仅适用于根组件吗?
我在子组件中设置辅助路由时遇到问题,由于某种原因,只有那些辅助路由才能从根组件开始工作.
这是我的路由器设置 export const routes: RouterConfig = [ { path: 'test1',component: Test1Component },{ path: 'test2',component: Test2Component,outlet: 'aux'},{ path: 'shell',component: ShellComponent,children: [ { path: 'department/:id',component: DepartmentDetailComponent },{ path: 'test3',component: Test3Component,outlet: 'aux2' } ] } ]; 如果我导航到 http://localhost:3000/shell/department/1(aux:test2) 然后输出是预期的,也就是说,Test2Component在ShellComponent和DepartmentDetailComponent中呈现在AppComponent中: 主要插座显示为蓝色,辅助插座为红色. 但是,如果我尝试导航到 http://localhost:3000/shell/department/1(aux2:test3) 我收到一条错误消息:
路由器插座如下: app.component.ts(aux:test2) <div class="app"> <h1>App</h1> <div class="primary-outlet"> <router-outlet></router-outlet> </div> <div class="aux-outlet"> <router-outlet name="aux"></router-outlet> </div> </div> shell.component.ts(aux2:test3) <div class="component"> <h1>Shell</h1> <div class="primary-outlet"> <router-outlet></router-outlet> </div> <div class="aux-outlet"> <router-outlet name="aux2"></router-outlet> </div> </div> 我错过了什么? 编辑:按照Arpit Agarwal的建议,导航到 http://localhost:3000/shell/(department/1(aux2:test3)) 诀窍: 但是,请在页面加载后查看URL.如果我现在按F5,我会回到原点:
编辑2:这是link to the project on github.
尝试使用
http://localhost:3000/shell/(department/1//aux2:test3)
URL具有格式(primaryroute // secondaryroute) 辅助和主要出口被认为是同一父母的兄弟 (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |