Question

我正在使用 Ionic 4

我在具有以下继承关系的页面中构建了应用程序

| app
  |- tabs
     |- tabs.page.ts
     |- tabs.module.ts
     |- tabs.routing.module.ts
  |- pages
     |- profile
        |- profile
           |- profile.module.ts
           |- profile.page.ts
        |- profile.module.ts
        |- profile-routing.module.ts
     |- pages.module.ts
     |- pages-routing.module.ts
  |- app.component.ts
  |- app.module.ts
  |- app-routing.module.ts

app-routing.module.ts

的内容

const routes: Routes = [
  { path: '', redirectTo: 'tabs', pathMatch: 'full'},
  { path: 'tabs', loadChildren: './tabs/tabs.module#TabsPageModule', canActivate: [AuthGuardService]},
];
@NgModule({
  imports: [
    RouterModule.forRoot(routes, { preloadingStrategy: PreloadAllModules })
  ],
  exports: [RouterModule]
})
export class AppRoutingModule {}

然后， tabs.routing.module.ts

const routes: Routes = [
  {
    path: '',
    component: TabsPage,
    loadChildren: '../pages/pages.module#PagesModule'
  }
];

@NgModule({
  imports: [
    RouterModule.forChild(routes)
  ],
  exports: [RouterModule]
})
export class TabsPageRoutingModule {}

进一步加载 PagesModule 和 pages-routing.module.ts

的内容

const routes: Routes = [
    { path: '', redirectTo: 'profile', pathMatch: 'full'},
    { path: 'profile', loadChildren: './profile/profile.module#ProfileModule'},
];
@NgModule({
    imports: [
        RouterModule.forChild(routes)
    ],
    exports: [RouterModule]
})
export class PagesRoutingModule {}

和 profile-routing.module.ts

的内容

const routes: Routes = [
    { path: '', loadChildren: './profile/profile.module#ProfilePageModule'},
];
@NgModule({
    imports: [
        RouterModule.forChild(routes)
    ],
    exports: [RouterModule]
})
export class ProfileRoutingModule {}

但在访问时

/tabs/profile

它给出错误为

错误错误：“未捕获（承诺）：错误：在'./profile/profile.module'中找不到'ProfilePageModule'

在 profile-routing.module.ts 中将 {path：``，loadChildren：'./profile/profile.module#ProfilePageModule'} 替换为 {路径：”，组件：ProfilePage} 正在工作。

Answer 1

为什么在配置文件目录中有两个“ profile.module.ts”文件？延迟加载时，请确保您的loadChildren路径指向其中正在导出“ ProfilePageModule”的文件，鉴于您的错误，我假设您指向的是不正确的“ profile.module.ts”

我会说{路径：”，组件：ProfilePage}可以正常工作，因为它正在急切地加载，而没有演示项目来审查很难讲清的代码，但是您是否尝试过：

const routes: Routes = [
    { path: '', loadChildren: './profile.module#ProfilePageModule'},
];
@NgModule({
    imports: [
        RouterModule.forChild(routes)
    ],
    exports: [RouterModule]
})
export class ProfileRoutingModule {}

离子角嵌套式布线

1 个答案: