Question

我在AppModule中声明了2个延迟加载的模块：

 {
    path: 'dashboard',
    loadChildren: () => import('./modules/dashboards/dashboard.module').then(m => m.DashboardModule),
    canActivate: [ AuthGuard ]
},
{
    path: 'auth',
    loadChildren: () => import('./modules/auth/auth.module').then(m => m.AuthModule)
},
{path: '', redirectTo: 'auth', pathMatch: 'full'},
{path: '**', component: PageNotFoundComponent},

auth模块包含登录页面。成功登录后，它应重定向到仪表板。可悲的是，我无法从auth模块中导航到仪表板。我尝试过

 this.router.navigate([ 'dashboard' ]);
 this.router.navigate([ './dashboard' ]);
 this.router.navigate([ '../dashboard' ]);

身份验证模块路由：

  {
    path: '',
    component: AuthContainerComponent,
    children: [
        {
            path: '',
            redirectTo: 'login',
            pathMatch: 'full',
        },
        {
            path: 'login',
            component: LoginComponent
        }, ...]}

仪表板模块路线：

  {
    path: 'customer',
    loadChildren: () => import('./customer/customer.module').then(m => m.CustomerModule),
    canActivate: [ AuthGuard ],
    data: {
        roles: [ Roles.Customer ]
    },
},
{
    path: 'staff',
    loadChildren: () => import('./staff/staff.module').then(m => m.StaffModule),
},
{path: '', redirectTo: 'customer', pathMatch: 'full'},

有什么想法为什么不起作用？是因为模块是延迟加载的吗？感谢您的帮助！

Answer 1

好的，完全是我的坏。 Auth Guard是问题所在。

Answer 2

你可以试试吗？

 {
    path: '',
    loadChildren: () => import('./modules/dashboards/dashboard.module').then(m => m.DashboardModule),
    canActivate: [ AuthGuard ]
},

请清除此问题，直到问题解决：

{path: '', redirectTo: 'auth', pathMatch: 'full'},

应该可以导航到

this.router.navigate([ 'dashboard/customer' ]);
this.router.navigate([ 'dashboard/staff' ]);

但仅当这些模块（员工和客户）在其映射配置中具有路径：''时。

您可以发布CustomerModule和StaffModule的代码吗？一次闪击将是完美的;-）

您还可以使用以下方法激活应用路由器中的路由日志记录：

RouterModule.forRoot(routes, {enableTracing: true}),

延迟加载的模块之间的路由ion Angle 9

2 个答案: