在 Angular 中有没有办法在子路径之前渲染父组件？

Question

我有一个组件，其中定义了一个路由器插座 (ParentComponent)。

<mat-accordion>some content</mat-accordion>
<mat-progress-bar *ngIf="loading"></mat-progress-bar>
<router-outlet></router-outlet>

我还有一个带有路由定义的路由器模块：

{path: 'parent', component: ParentComponent, children: {path: 'sub', loadChildren: () => import('./sub/sub.module').then(mod => mod.SubModule)}}

所以它延迟加载 SubModule 模块，它只有一个路径，在一些数据解析后呈现：

{path: '', component: SubComponent, resolve: {data: SubResolverService}

默认情况下，用户首先通过 'parent' 路线，然后才使用按钮加载 'parent/sub'，以便显示手风琴和加载。

然而，当 url 被显式写入并且我们直接进入 'parent/sub' 路由时，应用程序等待子解析器获取数据，只有在这之后它才会渲染手风琴和进度条，因此用户必须盯着空白页面，直到加载每条路线数据。

有没有办法先渲染父组件，显示进度条，然后才开始解析子路由？

Answer 1

路由器等待解析器完成（事件子解析器）。解析器将数据同步带到组件。为了更好的用户体验，您应该在数据即时可用时（例如配置数据）使用解析器，否则您应该在组件内部使用 Observable 以避免阻塞显示

Is there a way to render parent components before subroutes in Angular?