Angular 5无法匹配延迟加载模块的命名出口上的任何路由[重复]

2023-12-23

我的根模块的路线是这样的:

        RouterModule.forRoot([
        { path: '', redirectTo: 'management-portal', pathMatch: 'full' },            
        { path: 'management-portal', loadChildren: './xxx/management-portal.module#ManagementPortalModule', canActivate: [AuthGuard] },          
        { path: 'login', component: LoginComponent },
        { path: '**', component: NotFoundComponent }
    ], {
       enableTracing: true 
    })

它按预期工作,我可以在登录后路由到 ManagementPortalModule。让我们看一下我的延迟加载的 ManagementPortalModule。

有一个命名的路由器出口。

 <router-outlet name='sub'></router-outlet>

我在 ManagementPortalModule 中的路线。

    RouterModule.forChild([
  {
    path: '', component: ManagementPortalComponent,        
    children: [            
        { path: '', component: Test1Component, outlet: 'sub' },
        { path: 'test2', component: Test2Component, outlet: 'sub' }            
    ]
  }         
])

它可以在开始时加载'sub'出口中的Test1Component。我想在单击链接时路由到 Test2Component

<a  [routerLink]="[{ outlets: { sub: ['test2'] } }]"></a>

生成的Url

/管理门户/(子:test2)

我点击时没有任何反应。然后我尝试了

<a [routerLink]="['',{ outlets: { sub: ['test2'] } }]">

Url

/管理门户(子:test2)

我认为该网址的格式正确this https://angular.io/guide/router#milestone-4-crisis-center-feature,然后我点击的时候出现错误

无法匹配任何路线。 URL 段:“test2”

请帮忙,非常感谢!


尝试使用命名出口路由的非空顶级路径。

ManagementPortalModule 中的路由。

    RouterModule.forChild([
  {
    path: 'load', component: ManagementPortalComponent,        
    children: [            
        { path: '', component: Test1Component, outlet: 'sub' },
        { path: 'test2', component: Test2Component, outlet: 'sub' }            
    ]
  }         
])

欲了解更多详情,请参阅:Angular 4 延迟加载命名路由器出口不起作用 https://stackoverflow.com/questions/47482230/angular-4-lazy-loading-with-named-router-outlet-not-working/47487220#47487220

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Angular 5无法匹配延迟加载模块的命名出口上的任何路由[重复] 的相关文章