angular - 如何修复未在 Angular Ionic 中加载的组件

Question

我正在尝试在 ionic Angular 中延迟加载一个组件，并且我已经获得了路由 (../app/buildings/:buildingId) 在我导航到它时不会抛出错误但是它没有加载正确的组件。

我认为它默认为父级，但我不知道如何修复它。我尝试了一些东西(不是延迟加载/将它全部放在 app.module 中)但我似乎无法修理它。感谢您的帮助。

tabs.router.module.ts

 {
    path: 'app',
    component: TabsPage,
    children: [
      {
        path: 'home',
        children: [
          {
            path: '',
            loadChildren: '../tab1/tab1.module#Tab1PageModule'
          }
        ]
      },
      {
        path: 'buildings',
        children: [
          {
            path: '',
            component: Tab2Page,
            resolve: {buildings: BuildingResolverService},
            loadChildren: '../tab2/tab2.module#Tab2PageModule'
          }
        ]
      },
      {
        path: 'tab3',
        ...

tab2.module.ts

export const tab2Routes: Routes = [
  {
    path: ':buildingId',
    component: BuildingComponent
  }
];
@NgModule({
  exports: [RouterModule],
  imports: [
    IonicModule,
    CommonModule,
    FormsModule,
    RouterModule.forChild(tab2Routes)
  ],
  declarations: [
    BuildingComponent
  ]
})
export class Tab2PageModule {}

前往 /buildings 加载正确的组件，/buildings/1 则不会。我希望第二条路线做同样的事情，我认为它默认为第一条路线，因为那条路线可能也匹配吗？如果是这种情况，我不确定如何解决。

我希望我已经足够清楚了

Answer 1

你的 tab2Routes 应该有路线 '' 作为你的默认 Tab2Component 和 :buildingId 作为 BuildingComponent(就像你已经拥有的一样):

export const tab2Routes: Routes = [
  { 
    path: '', 
    component: Tab2Page 
  },
  {
    path: ':buildingId',
    component: BuildingComponent
  }
];