在子级解析之前显示嵌套路由的父级组件(立即显示路由器出口)

Mic*_*ick 6 angular-routing angular angular-router angular-guards

我有嵌套组件:

  • 应用组件
    • 仅包含路由器插座
  • 页面包装组件
    • 仅包含主菜单和另一个路由器插座
    • 需要在显示之前从 API 加载主菜单
  • 内容组件
    • 包含实际的页面内容
    • 需要在显示之前从 API 加载页面内容

我使用 Router 的Resolve解析主菜单和页面内容:

const routes: Routes = [
  {
    path:        '',
    component:   PageWrapperComponent,
    resolve: {
        mainMenu: MainMenuResoler,
    },
    children:    [
      {
        path: '',
        component: ContentComponent,
        resolve: {
           content: ContentResolver,
        }
      }
    ]
];
Run Code Online (Sandbox Code Playgroud)

我想在 MainMenuResoler 完成后立即显示主菜单(PageWrapperComponent)。ContentResolver 完成后,然后就是内容(ContentComponent)。但如何呢?

我预料到路由器会出现这种行为。相反,Angular 会等待两个解析器完成,然后同时显示 PageWrapperComponent 和 ContentComponent。