Lazyloading children из других модулей в Angular2

Question

У меня проблема с дочерними маршрутами на уровне корневого приложения.

Мое приложение структурировано с помощью корневого модуля приложения, который импортирует SecureModule и PublicModule. Затем SecureModule импортирует ProviderModule и PracticeModule. Каждый модуль определяет собственные маршруты с помощью .forChild (за исключением того, что AppModule определяет forRoot). По какой-то причине все пути по умолчанию (те, которые перечислены с «как путь») в каждом модуле, присутствуют на уровне корневого модуля приложения.

Здесь представлена ​​схема, иллюстрирующая Предзнаменование корня дерева:

SecureComponent является компонентом функции (без выбора), который определяет расположение для защищенной области и имеет собственный маршрутизатор розетка. Как вы можете видеть из корневого дерева, в нем идеальны подходы к методу Практика и Провайдера. Тем не менее, модули «Практика и поставщик» также выходят прямо из AppComponent.

Я ленивую загрузку дочерних путей через loadChildren и используя pathMatch полностью по умолчанию, поэтому я не уверен, почему они прикрепляются к корневому компоненту.

My безопасных маршрутов модуля определяются как например:

export const secureRoutes = [ 
{ 
    path: 'secure', component: SecureComponent, children: [ 
     { path: '', redirectTo: 'firstuse', pathMatch: 'full' }, 
     { path: 'firstuse', component: FirstUseComponent }, 
     { path: 'practice', loadChildren: './+practice#PracticeModule' }, 
     { path: 'provider', loadChildren: './+provider#ProviderModule' } 
    ] 
}, 

];

моих практика маршрутов определяется как:

export const practiceModuleRoutes = [ 
{ path: '', redirectTo: 'dashboard', pathMatch: 'full' }, 
{ path: 'dashboard', component: PracticeDashboardComponent }, 
{ path: ':id', component: PracticeViewerComponent } 
]; 

моих приложение маршруты определяются как:

export const appModuleRoutes: Routes = [ 
{ path: '', redirectTo: 'public', pathMatch: 'full' }, 
{ path: 'public', component: PublicComponent }, 
{ path: 'id_token', redirectTo: 'secure' }, 
{ path: 'logoff', component: LogoffComponent }, 
{ path: 'Unauthorized', component: UnauthorizedComponent }, 
{ path: '**', component: NoContentComponent }, 
]; 

Кто-нибудь есть мысли о том, почему этих практиках и Provider маршруты по умолчанию представляют в корневом приложении компонент?

Answer 1

Я только что понял, что мой AppModule импортировал модули Secure и Public. Когда он это сделал, он, похоже, включил маршруты для этих модулей на корневом уровне. Когда произошли loadChildren, он также загрузил правильные пути для этих маршрутов, поэтому они существуют в обоих местах.

Чтобы устранить проблему, я удалил импорт SecureModule и PublicModule из AppModule. Это очистило путь для того, чтобы пути загружались только как дети.