Question

我正在开发一个没有根/路由的Angular 5应用程序。它应该重定向到一个延迟加载的孩子。每个子模块都有自己的重定向/child到/child/view（其中“child”是该功能的名称）。

这个想法是根路由不知道孩子的默认路由在哪里。所以我可以重定向到首选的子模块，并让该子进程处理最终的重定向。所以应该有两个重定向。

这是我的根MainRoutes.ts文件：

const routes: Routes = [
    {path: '', redirectTo: '/posts', pathMatch: 'full'},
    {
        path: '', component: MainComponent,
        children: [
            {path: 'albums', loadChildren: 'app/Albums/Albums#AlbumsModule'},
            {path: 'todos', loadChildren: 'app/Todos/Todos#TodosModule'},
            {path: 'posts', loadChildren: 'app/Posts/Posts#PostsModule'},
            {path: 'users', loadChildren: 'app/Users/Users#UsersModule'}
        ]
    },
    {path: '**', component: NotFoundComponent}
];

@NgModule({
    imports: [RouterModule.forRoot(routes)],
    exports: [RouterModule]
})
export class MainRoutesModule {
}

我上面的主要路由应该将/根路径重定向到/posts子路由，但它会重定向到/albums。我无法判断问题是在我的主要路线定义还是我的子路线中。

这是我的AlbumsRoutes.ts：

const routes: Routes = [
    {path: '', redirectTo: '/albums/view', pathMatch: 'full'},
    {path: 'view', component: ViewComponent}
];

@NgModule({
    imports: [RouterModule.forChild(routes)],
    exports: [RouterModule]
})
export class AlbumsRoutesModule {
}

我还有TodosModule，PostsModule和UsersModule与上述相同（除了名称不同）。

我之所以这样写，是因为我认为forChild路由与它们的加载位置有关。

当我转到/时，网址会重定向到/albums/view。似乎我的root中定义的重定向没有被使用。我需要它重定向到/posts/view。

它转到/albums/view的事实告诉我第一个孩子的路线正在被使用。

我知道我犯了一个简单的错误，但我看不到它。

Answer 1

我认为redirectTo仅适用于同一级别的路由。

您可以改试试

const routes: Routes = [
  {path: '', redirectTo: '/posts', pathMatch: 'full'},
  {
    path: 'albums',
    component: MainComponent,
    loadChildren: 'app/Albums/Albums#AlbumsModule'
  },
  {
    path: 'posts',
    component: MainComponent,
    loadChildren: 'app/Posts/Posts#PostsModule'
  },
  ...
  {path: '**', component: NotFoundComponent}
];

如何在Angular中重定向到子路由并再次重定向？

1 个答案: