angular - Angular5 routing: Routes after canActivate are ignored

Question

I'm trying to implement routes to separate a public and a secured area.

What i tried to accomplish:

User IS authenticated: The route which is loading the routes from SecureModel should be "skipped".

User is NOT authenticated: The route which is loading the routes from SecureModel should be "skipped".

My configuration for this:

AuthGuard returns a hardcoded false. If i switch to true all secured routes are working as expected.

app-routing.module.ts

const routes: Routes = [
{
    path: '',
    canActivate: [ AuthGuard ],
    loadChildren: 'app/secured/secured.module#SecuredModule'
},
{
    path: '',
    loadChildren: 'app/public/public.module#PublicModule'
},
{ path: '**', redirectTo: '' }
];

secured-routing.module.ts

const routes: Routes = [
{
    path: '',
    component: SecuredLayoutComponent,
    children: [
    { path: '', redirectTo: 'customer-orders', pathMatch: 'full' },
    {
        path: 'customer-orders',
        loadChildren: 'app/secured/customer-orders/customer-orders.module#CustomerOrdersModule'
    },
    {
        path: 'manufacturers',
        loadChildren: 'app/secured/manufacturers/manufacturers.module#ManufacturersModule'
    },
    {
        path: 'roles',
        loadChildren: 'app/secured/roles/roles.module#RolesModule'
    },
    {
        path: 'users',
        loadChildren: 'app/secured/users/users.module#UsersModule'
    },
    { path: '**', component: Error404Component }
    ]
}
];

public-routing.module.ts

const routes: Routes = [
{
    path: '',
    component: PublicLayoutComponent,
    children: [
    { path: '', redirectTo: 'login', pathMatch: 'full' },
    { path: 'login', component: LoginComponent },
    { path: '**', component: Error404Component }
    ]
}
];

The public and secured routes for them selfs are working, when I'm commenting one of the main routes out.

I like this kind of routing structure very much and it would be great if someone could help to get the "switch" between public and secured routes working.

Answer 1

您不能将两个路径都设置为空白。试试下面的一个：

const routes: Routes = [
{
    path: 'a',
    canActivate: [ AuthGuard ],
    loadChildren: 'app/secured/secured.module#SecuredModule'
},
{
    path: '',
    loadChildren: 'app/public/public.module#PublicModule'
},
{ path: '**', redirectTo: '' }
];