小编Gil*_*ics的帖子

有没有办法在Angular中的子路由之前渲染父组件?

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

<mat-accordion>some content</mat-accordion>
<mat-progress-bar *ngIf="loading"></mat-progress-bar>
<router-outlet></router-outlet>
Run Code Online (Sandbox Code Playgroud)

我也有一个带有路由定义的路由器模块:

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

因此,它懒惰地加载SubModule模块,该模块只有一个路径,该路径在解析某些数据后呈现:

{path: '', component: SubComponent, resolve: {data: SubResolverService}
Run Code Online (Sandbox Code Playgroud)

默认情况下,用户先通过“父”路线,然后才使用按钮加载“父/子”,以便显示手风琴和载荷。

但是,当url被明确写入并且我们直接转到“父/子”路径时,应用程序将等待子解析器获取数据,并且只有在此之后它才会呈现手风琴和进度条,因此用户必须凝视空白页,直到加载了每个路线数据。

有没有一种方法可以先渲染父组件,然后显示进度条,然后才开始解析子路线,该方法才会显示?

angular angular-router

5
推荐指数
1
解决办法
44
查看次数

标签 统计

angular ×1

angular-router ×1