在嵌套的 <router-outlet> 中使用 redirectTo [英] Using redirectTo in a nested <router-outlet>
本文介绍了在嵌套的 <router-outlet> 中使用 redirectTo的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我有一个非常简单的路由器配置:
I have this very simple router config:
export const routes: Routes = [
{
path: '',
component: MiddleComponent,
pathMatch: 'full',
children: [
{
path: '',
redirectTo: './task-queue',
pathMatch: 'full',
},
{
path: 'task-queue',
component: TestComponent,
},
]
},
];
演示:https://stackblitz.com/edit/angular-a7sxdf?file=app%2Fapp.routing.ts
MiddleComponent
的模板就是
.
Where MiddleComponent
's template is just <router-outlet></router-outlet>
.
我希望在页面加载后我应该被重定向到 task-queue
但我不是.我可以看到 MiddleComponent
已呈现,但 TestComponent
未呈现.
I'd expect that after page load I should be redirected to task-queue
but I'm not. I can see the MiddleComponent
is rendered but TestComponent
isn't.
推荐答案
需要为测试队列添加另一个具有重定向属性的路径.
Need to add another path with redirect property for test-queue.
export const routes: Routes = [
{ path: '', redirectTo: '/task-queue' ,
pathMatch: 'full'},
{ path: '', component: MiddleComponent,
children: [
{ path: '', redirectTo: '/task-queue',pathMatch: 'full' },
{ path: 'task-queue', component: TestComponent }
]
}
];
这篇关于在嵌套的 <router-outlet> 中使用 redirectTo的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文