Angular 7 嵌套模块路由

Question

我不明白具有多个嵌套模块的路由是如何工作的。 RouteTree 对我来说看起来不错且正确

它一直有效到“更多”页面。单击 ContactPage 后，url 会发生变化，但视图不会呈现。

这是我的路由器的样子：

app.routing.module

const routes: Routes = [
  { path: '', loadChildren: './pages/tabs/tabs.module#TabsPageModule' }
];

@NgModule({
  imports: [
      RouterModule.forRoot(routes, { preloadingStrategy: PreloadAllModules })
  ],
  exports: [RouterModule]
})
export class AppRoutingModule {}

tabs.routing.module

const routes: Routes = [
    {
        path: 'tabs',
        component: TabsPage,
        children: [
            {
                path: 'more',
                loadChildren: '../more/more.module#MorePageModule'
            },
            {
                path: '',
                redirectTo: 'home',
                pathMatch: 'full'
            }
        ]
    },
    {
        path: '',
        redirectTo: 'tabs/home',
        pathMatch: 'full'
    }
];

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

more.routing.module

const routes: Routes = [
    {
        path: '',
        component: MorePage,
        children: [
            {
                path: 'contact',
                component: ContactPage
            },
        ]
    }
];

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

contact.module

const routes: Routes = [
  {
    path: 'contact',
    component: ContactPage
  }
];

@NgModule({
  imports: [
    SharedModule,
    RouterModule.forChild(routes)
  ],
  declarations: [ContactPage],
  providers: [
  ]
})
export class ContactPageModule {}

我不知道问题是什么。有什么我遗漏的吗？

Answer 1

请尝试重写以下内容（more.routing.module）：

const routes: Routes = [
    {
        path: '',
        component: MorePage,
        children: [
            {
                path: 'contact',
                component: ContactPage
            },
        ]
    }
];

像这样使用loadChildren：

children: [
    {
        path: 'contact',
        loadChildren: 'path/to/contact.module#ContactPageModule'
    },
]