Question

使用带有主app.module.ts和app-routing.module.ts的angular 5，我得到了如下所示的完全正常工作。

我试图将布局路径移动到新的layout-routing.module.ts中，所以我会有与其他模块类似的结构，但是：

应用-routing.module.ts

export const RootRoutes: Routes = [
  {
    path     : '',
    component: ResolveComponent,
    resolve  : {
      resolved: AppResolver
    },
    children: [

      /* using only the following: working method */
      {
        path       : '',
        component  : LayoutComponent,
        canActivate: [AuthGuard],
        children: [
          {
            path        : 'dashboard',
            loadChildren: 'app/dashboard/dashboard.module#DashboardModule'
          },
        ]
      },

      /* using this instead results in error: Component ResolveComponent is not part of any
         module */
      {
        path        : '',
        loadChildren: 'app/layout/layout.module#LayoutModule'
      },






      {
        path        : 'signin',
        loadChildren: 'app/public/public.module#PublicModule'
      },
      {
        path        : 'error',
        loadChildren: 'app/error/error.module#ErrorModule'
      }
    ]
  }
];

布局routing.module.ts

export const LayoutRoutes: Routes = [
  {
    path       : '',
    component  : LayoutComponent,
    canActivate: [AuthGuard],
    children: [
      {
        path        : 'dashboard',
        loadChildren: 'app/dashboard/dashboard.module#DashboardModule'
      }
    ]
  },
];

新的方式给了我“在任何模块中找不到组件ResolveComponent”？我错过了什么。

组件ResolveComponent肯定在app.module中声明，它导入上面的app-routing.module。

如果我只想延迟加载layout.module，为什么以及如何才能丢失该组件？！

Answer 1

同步加载LayoutModule是要走的路......

export const RootRoutes: Routes = [
  {
    path     : '',
    component: ResolveComponent,
    resolve  : {
      resolved: AppResolver
    },
    children: [
      {
        path        : '',
        loadChildren: () => LayoutModule
      },
      {
        path        : 'signin',
        loadChildren: 'app/public/public.module#PublicModule'
      }
    ]
  }
];

空路径，懒加载路由器问题与角5

1 个答案: