Angular 带loadchildren的角度延迟加载路由

我有一个爱奥尼亚应用程序，有标签和登录页面。选项卡组件是其自己的模块，每个选项卡都有一个路由模块，每个选项卡都是其自己的模块。当应用程序加载时，我想直接进入登录页面，然后在登录时重定向到tabs组件的其中一个选项卡（菜单/主页）

const routes: Routes = [
  {
    path: '',
    loadChildren: () => import('./tabs/tabs.module').then(m => 
    m.TabsPageModule)
  }, 
  {
    path: 'login',
    component: LoginComponent
  },
  {
    path: "",
    component: LoginComponent
  },
  {
    path: '',
    redirectTo: '',
    pathMatch: 'full'
  }
];
@NgModule({
  imports: [
    RouterModule.forRoot(routes, { preloadingStrategy: PreloadAllModules })
  ],
  exports: [RouterModule]
})
export class AppRoutingModule {}

---

将选项卡路由更改为：-

const routes: Routes = [
  {
    path: 'menu',
    children: [
      {
        path: '',
        component: TabsPage
      },
      {
        path: 'home',
        loadChildren: () => import('./home/home.module').then(m => m.HomePageModule)
      },
      {
        path: 'library',
        loadChildren: () => import('./library/library.module').then(m => m.LibraryPageModule)
      },
      {
        path: 'search',
        loadChildren: () => import('./search/search.module').then(m => m.SearchPageModule)
      },
      {
        path: 'profile',
        loadChildren: () => import('./profile/profile.module').then(m => m.ProfileModule)
      },
      {
        path: '',
        redirectTo: 'menu/home',
        pathMatch: 'full'
      }
    ]
  },
  {
    path: '',
    redirectTo: '/menu/home',
    pathMatch: 'full'
  }
];

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

或

将路由器插座置于选项卡中

---

要了解原因，请阅读：-

您面临的问题是什么？我在尝试从登录组件导航到“菜单/主页”时出错。找不到路由@aakashgarg请在下面找到我的答案。

const routes: Routes = [
  {
    path: 'menu',
    children: [
      {
        path: '',
        component: TabsPage
      },
      {
        path: 'home',
        loadChildren: () => import('./home/home.module').then(m => m.HomePageModule)
      },
      {
        path: 'library',
        loadChildren: () => import('./library/library.module').then(m => m.LibraryPageModule)
      },
      {
        path: 'search',
        loadChildren: () => import('./search/search.module').then(m => m.SearchPageModule)
      },
      {
        path: 'profile',
        loadChildren: () => import('./profile/profile.module').then(m => m.ProfileModule)
      },
      {
        path: '',
        redirectTo: 'menu/home',
        pathMatch: 'full'
      }
    ]
  },
  {
    path: '',
    redirectTo: '/menu/home',
    pathMatch: 'full'
  }
];

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