Question

当用户访问SecuredModule路径时，我有一个app.routing.ts动态加载（在我的/secured中）。

在本单元中，我有以下路线定义：

const APP_ROUTES: Routes = [
    { path: '', component: SecuredComponent, , children: [
        { path: 'application', loadChildren: 'app/application/application.module#ApplicationModule'}
    ]},
    { path: '**', pathMatch: 'full', redirectTo: 'application' }

];

由于此模块加载了loadChildren，因此示例中的''（默认）路由实际上指的是'/secured'。在''路径中，我需要加载SecuredComponent，因为我有自定义布局和<router-outlet>标记，它将显示此路线的子项。

但是'/secured'不是用户登陆的有效路由，因为SecuredComponent只是一个占位符，所以我需要自动将它们重定向到'application'子路由。

问题是定义的重定向函数仅在我输入不存在的路径时被调用，例如'secured/any-fake-route'

Answer 1

问题在于{ path: '**', pathMatch: 'full', redirectTo: 'application' }定义位于最底层，因此当用户访问'/secured'时会调用nevers，因为''是有效路由并且首先匹配。

我修正了如下：

const APP_ROUTES: Routes = [
    { path: '', pathMatch: 'full', redirectTo: 'application' },
    { path: '', component: SecuredComponent, canActivate: [SecuredMiddlewareService], children: [
        { path: 'application', loadChildren: 'app/application/application.module#ApplicationModule'}
    ]},
    { path: '**', pathMatch: 'full', redirectTo: 'application' },
];

注意第一行。当用户访问'/secured'时，他们会自动重定向到'/secured/application'。由于'application'是''的子路由，因此它们都会被调用。

因此，使用此配置，所有以下示例都会根据需要成功重定向到'/secured/application'：

'/secured'
'/secured/application'
'/secured/any-fake-route'

Angular2路由器 - 具有重定向到默认子级的组件的父路由

1 个答案: