我有一个懒惰加载子路由功能模块的顶级路由器,升级到Angular v11.0.1后已停止正常工作。
在ng11路由器事件的注销,该功能模块被加载,并RouteConfigLoadStart
和RouteConfigLoadEnd
与适当的儿童路由器的配置都被触发,但是RoutesRecognized
不叫。如果我routerLink
第二次单击该链接(不是),则所有事件都将正常触发,并加载适当的组件。
需要澄清的是:这不仅仅是链接问题。除非我转到其他路由(第一次也不会加载),然后再返回原始路由,否则它在初始页面加载上也不起作用
在Angular v10.2.3中,此设置可以正常运行(即单击并在初始加载时)
AppRoutingModule:
const routes: Routes = [
{path: '', redirectTo: '/dashboard', pathMatch: 'full'},
{path: 'browse', loadChildren: () => import('./browse/browse.module').then(m => m.BrowseModule)},
{path: 'dashboard', loadChildren: () => import('./dashboard/dashboard.module').then(m => m.DashboardModule)},
{path: '**', redirectTo: '/dashboard'}
];
@NgModule({
imports: [RouterModule.forRoot(routes, {useHash: true})],
exports: [RouterModule]
})
export class AppRoutingModule { }
仪表板路由模块
const routes: Routes = [
{path: '', component: DashboardComponent},
{path: ':id', component: DashboardComponent}
];
@NgModule({
imports: [RouterModule.forChild(routes)],
exports: [RouterModule]
})
export class DashboardRoutingModule { }
应用模块
@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule,
AppRoutingModule
],
providers: [{provide: APP_BASE_HREF, useValue: ''}],
bootstrap: [AppComponent]
})
export class AppModule { }
AppComponent模板
<router-outlet></router-outlet>
我很高兴提供任何可能有助于深入了解的其他详细信息。提前致谢。
因此,经过大量的构建工作,我已经弄清楚了!我们在混合环境中执行此操作,在混合环境中,服务器绑定的JSF容器内部有一个“ SPA”,并且标头为Angular Element。到目前为止,我一直在使用ng-build-plus
和--extra-webpack-config
指定webpack.externals
在标头和SPA之间共享公用资源:
module.exports = {
externals: {
"rxjs": "rxjs",
"@angular/core": "ng.core",
"@angular/common": "ng.common",
"@angular/common/http": "ng.common.http",
"@angular/platform-browser": "ng.platformBrowser",
"@angular/platform-browser-dynamic": "ng.platformBrowserDynamic",
"@angular/compiler": "ng.compiler",
"@angular/forms": "ng.forms"
}
}
将其从SPA版本中删除后,一切都按预期开始工作。像它看起来可能是用怎样的问题ngx-build-plus
是拼接事情,这是问题的外部在一起。
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句