Загрузка нескольких модулей лениво в Angular 6 - PullRequest
Новая
       4

Загрузка нескольких модулей лениво в Angular 6

0 голосов
/ 06 мая 2019

Я пытаюсь создать приложение Angular, которое поддерживает несколько панелей мониторинга. В моем app-routing.module.ts я пытаюсь лениво загрузить все компоненты из этих разных панелей мониторинга по их определенному пути.

Мой app-routing.module.ts файл определяет маршруты следующим образом: 

// other initialization codes
{ path: '', redirectTo: 'login', pathMatch: 'full' },
{ path: 'login', loadChildren: './authentication/authentication.module#AuthenticationModule' },
{ path: 'dashboardAlpha1', loadChildren: './dash-alpha1/dash-alpha1.module#DashAlpha1Module' },
{ path: 'dashboardAlpha2', loadChildren: './dash-alpha2/dash-alpha2.module#DashAlpha2Module' }

В моем app.module.ts импорте я добавляю эти модули как: 

// other codes
imports: [
// other modules
AppRoutingModule,
DashAlpha1Module,
DashAlpha2Module,
]

Теперь проблема в том, что когда я пытаюсь перейти к любым маршрутам в dashboardAlpha1, он работает нормально. Когда я пытаюсь перейти к любым маршрутам в dasboardAlpha2, я получаю сообщение об ошибке: 

 Component RespondentViewComponent is not part of any NgModule or the module has not been imported into your module

Теперь обе панели мониторинга имеют компоненты с одинаковым именем и одинаковым путем. Например, 

/dashboardAlpha1/home
/dashboardAlpha2/home

Исходя из логина, я должен перенаправить на одну из приборной панели. Оба модуля настроены одинаково.

Что я делаю неправильно?

РЕДАКТИРОВАТЬ 1

Файл dash-alpha1-routing.module.ts

const routes: Routes = [
  { path: "", redirectTo: "home", pathMatch: "full" },
  { path: "home", component: DashAlpha1HomeComponent },
  { path: "stationView", component: StationViewComponent },
  { path: "profile", component: ProfileComponent },
  { path: "respondentView", component: RespondentViewComponent }
];

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

export class DashAlpha1RoutingModule { }

Файл dash-alpha1.module.ts

import { DashAlpha1RoutingModule } from './dash-alpha1-routing.module';
import { DashAlpha1HomeComponent } from './dash-alpha1-home/dash-alpha1-home.component';
import { StationViewComponent } from './station-view/station-view.component';
import { ProfileComponent } from './profile/profile.component';
import { RespondentViewComponent } from './respondent-view/respondent-view.component';


@NgModule({
  declarations: [
    DashAlpha1HomeComponent, StationViewComponent, ProfileComponent, RespondentViewComponent
  ],
 imports: [
    CommonModule,
    DashAlpha1RoutingModule
 ],
 exports: [
    DashAlpha1HomeComponent, StationViewComponent, ProfileComponent, RespondentViewComponent
 ]
})
export class DashAlpha1Module { }

Файл dash-alpha2-routing.module.ts

const routes: Routes = [
  { path: "", redirectTo: "home", pathMatch: "full" },
  { path: "home", component: DashAlpha2HomeComponent },
  { path: "stationView", component: StationViewComponent },
  { path: "respondentView", component: RespondentViewComponent },
  { path: "profile", component: ProfileComponent }
];

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

Файл dash-alpha2.module.ts

import { DashAlpha2RoutingModule } from './dash-alpha2-routing.module';
import { DashAlpha2HomeComponent } from './dash-alpha2-home/dash-alpha2-home.component';
import { StationViewComponent } from './station-view/station-view.component';
import { ProfileComponent } from './profile/profile.component';
import { RespondentViewComponent } from './respondent-view/respondent-view.component';

@NgModule({
   declarations: [
DashAlpha2HomeComponent, StationViewComponent, ProfileComponent, RespondentViewComponent
   ],
   imports: [
      CommonModule,
      DashAlpha2RoutingModule
   ],
   exports: [
    DashAlpha2HomeComponent, StationViewComponent, ProfileComponent, RespondentViewComponent
   ]
  })
  export class DashAlpha2Module { }
...