Angular 5 Не удается сопоставить какие-либо маршруты на именованном выходе модуля с ленивой загрузкой

Мой маршрут корневого модуля выглядит так:

        RouterModule.forRoot([
        { path: '', redirectTo: 'management-portal', pathMatch: 'full' },            
        { path: 'management-portal', loadChildren: './xxx/management-portal.module#ManagementPortalModule', canActivate: [AuthGuard] },          
        { path: 'login', component: LoginComponent },
        { path: '**', component: NotFoundComponent }
    ], {
       enableTracing: true 
    })

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

Есть именованный роутер-розетка.

 <router-outlet name='sub'></router-outlet>

Мой маршрут в ManagementPortalModule.

    RouterModule.forChild([
  {
    path: '', component: ManagementPortalComponent,        
    children: [            
        { path: '', component: Test1Component, outlet: 'sub' },
        { path: 'test2', component: Test2Component, outlet: 'sub' }            
    ]
  }         
])

Он может загрузить Test1Component в "под" розетку в начале. Я хочу направить на Test2Component, когда я нажимаю на ссылку

<a  [routerLink]="[{ outlets: { sub: ['test2'] } }]"></a>

Сгенерированный URL

/портал управления/(sub:test2)

ничего не произошло, когда я нажал. Затем я попытался

<a [routerLink]="['',{ outlets: { sub: ['test2'] } }]">

URL

/портал управления (sub:test2)

Я думаю, что URL-адрес имеет правильный формат в соответствии с this, тогда ошибка произошла, когда я нажал

Не удается сопоставить ни одного маршрута. Сегмент URL: 'test2'

Пожалуйста, помогите, большое спасибо!


person LittleNewb    schedule 26.11.2017    source источник
comment
проверьте мой недавний ответ stackoverflow.com/questions/47482230/   -  person mohit uprim    schedule 26.11.2017


Ответы (1)


Попробуйте непустой путь верхнего уровня с маршрутизацией именованных выходов.

Маршрут в ManagementPortalModule.

    RouterModule.forChild([
  {
    path: 'load', component: ManagementPortalComponent,        
    children: [            
        { path: '', component: Test1Component, outlet: 'sub' },
        { path: 'test2', component: Test2Component, outlet: 'sub' }            
    ]
  }         
])

Для получения более подробной информации см.: Angular 4 Lazy загрузка с именованным маршрутизатором-выходом не работает

person mohit uprim    schedule 26.11.2017
comment
Ты абсолютный герой! - person user3640967; 11.10.2018