我在一个项目上工作,我需要使用一个子标签<router-outlet>
级加载标签上的不同的子组件,something like this
因此,我在我的user-component
中创建了一个user-outlet
来加载特定的用户图片、待办事项等.
<router-outlet name="user-outlet"></router-outlet>
const USER_ROUTES: Routes = [
{
path: '',
component: UserComponent,
children: [
{
path: '',
component: UserDefaultContentComponent,
outlet: 'user-outlet',
},
{ path: 'todo', component: UserTodoComponent, outlet: 'user-outlet' },
{ path: 'pics', component: UserPicsComponent, outlet: 'user-outlet' },
],
},
];
export const userRouting = RouterModule.forChild(USER_ROUTES);
但是ANGLING没有在这个子router-outlet 上加载内容,而是重定向到404,这里是重现该问题的堆栈闪电战.
https://stackblitz.com/edit/angular-kvv1g4?file=src%2Fapp%2Fapp.component.ts个
以及重定向到404的示例性路由
/user/todo
/user/pics