帶有延遲加載的 Angular routerLink

Question

如果此問題已得到解答，我深表歉意。 我還沒有發現像我這樣的問題。

我有一個有兩個“頁面”的角度應用程序。 頁面 = 帶有模塊的普通組件。 我有一堆連接在一個模塊中的“組件”。 （這是文件結構 - https://i.imgur.com/fs6tXgg.png ）

現在，在app-routing.module ，我使用延遲加載來加載兩個頁面。 像這樣：

const routes: Routes = [
  {
    path: '',
    loadChildren: () => import('./pages/user/user.module').then(mod => mod.UserModule)
  },
  {
    path: '',
    loadChildren: () => import('./pages/admin/admin.module').then(mod => mod.AdminModule)
  }
];

這很好用。 在用戶頁面中，我加載了主菜單組件。 ..<app-main-menu></aapp-main-menu>...

問題- 但現在，我想將routerLink="/hotels添加到主菜單組件中的按鈕，在用戶頁面中，因此當用戶單擊按鈕時，頁面將加載不同的組件，項目列表。（不是主菜單）

我嘗試在app-routing.module.ts添加一個新路徑：

  {
    path: 'item-list',
    component: ItemListComponent
  }

但我得到一個錯誤說

Component MainMenuComponent 不是任何 NgModule 的一部分，或者該模塊尚未導入到您的模塊中。

出現這個錯誤的原因是item-list.component加載到user-components.module.ts中，在user.module.ts（頁面加載的主模塊）中調用。

所以全局問題是：如何在使用延遲加載時將 routerLink 設置為組件（因為我想要的組件是在特定模塊中聲明的）。

Answer 1

Kinda 通過調用 app-routing.module.ts 中包含該組件的模塊來解決該問題

  {
    path: 'list',
    loadChildren: () => import('./components/user-components/user-components.module').then(mod => mod.UserComponentsModule)
  }

user.module 有：

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

...
  imports: [
    RouterModule.forChild(routes)
  ]