角路由儿童需​​要继续/

Question

例如，我不知道如何管理路由

• 主机名/：用户名/
• 主机名/：用户名/工作
• 主机名/：用户名/事件

所以这里的主要问题是我总是得到主机名/：用户名/通用，该主机名必须是主机名/：用户名/

{
  path: ':username',
  component: ProfileComponent,
  resolve: {
    user: ProfileResolve
  },
  children: [
    {
      path: '',
      redirectTo: 'general',
      pathMatch: 'full'
    },
    {
      path: 'general',
      component: GeneralComponent
    },
    {
      path: 'events',
      component: ProfileEventsComponent
    },
    {
      path: 'jobs',
      component: ProfileJobsComponent
    },
  ]
}

Answer 1

问题是因为redirectTo是空路由（''）。它的值应该是redirectTo: './general'而不是redirectTo: 'general'

像这样更改您的路由配置：

{
    path: ':username',
    component: ProfileComponent,
    children: [
      { path: '', redirectTo: './general', pathMatch: 'full' },
      { path: 'general', component: GeneralComponent },
      { path: 'events', component: ProfileEventsComponent },
      { path: 'jobs', component: ProfileJobsComponent },
    ]
}

这是您推荐的Sample StackBlitz。

Answer 2

  

首先，删除redirectTo，这会将空白值重定向到general。您可以改为映射默认组件。

path: ':username',
component: ProfileComponent,
resolve: {
  user: ProfileResolve
},
children: [
  { path: '', component: GeneralComponent },
  { path: 'general', component: GeneralComponent },
  { path: 'events', component: ProfileEventsComponent },
  { path: 'jobs', component: ProfileJobsComponent },
]

如果您不想默认加载任何组件redirectTo，GeneralComponent或ProfileEventsComponent，则可以完全删除ProfileJobsComponent。