Угловая маршрутизация - дочерний маршрут по умолчанию активируется на уровне корневого маршрута - PullRequest
Новая
       6

Угловая маршрутизация - дочерний маршрут по умолчанию активируется на уровне корневого маршрута

0 голосов
/ 09 октября 2018

У меня возникла эта проблема в моем приложении Angular 5, где дочерний маршрут активируется на выходе маршрутизатора, который должен включить корневой маршрут.Я надеюсь, что кто-то, читающий это, сможет обнаружить проблему в моих определениях маршрутов, которую я не смог обнаружить в течение последних нескольких дней.

В моем приложении Angular есть 3 вложенных уровня маршрута.У меня есть маршруты, определенные в отдельных модулях.

В модуле приложения я определил корневые маршруты как: 

const mainRoutes: Route[] = [
    {
        path: '', redirectTo: 'mainApp', pathMatch: 'full'
    },
    {
        path: 'mainApp', canActivate: [AuthGuardService], component: TabbarComponent,
        children: [
            { path: 'home', canActivate: [AuthGuardService], component: HomeComponent },
            { path: 'books', canActivate: [AuthGuardService], loadChildren: () => BookshModule },
            { path: 'authors', canActivate: [AuthGuardService], loadChildren: () => AuthorsModule },
            { path: 'research-articles', canActivate: [AuthGuardService], loadChildren: () => ResArticlesModule },
        ]
    },
    {
        path: 'login', component: LoginComponent
    },    
    {
        path: '**', redirectTo: 'mainApp', pathMatch: 'full'
    }
];

@NgModule({
    imports: [
        RouterModule.forRoot(mainRoutes, { enableTracing: false })
    ],
    exports: [
        RouterModule
    ]
})

Для BooksModule (как и AuthorsModule и ResArticlesModule),маршруты выглядят так: 

const bookroutes: Route[] = [
    {
        path: '', component: BooksComponent,
        children: [
            { path: 'fiction',  canActivate: [AuthGuardService], component: FictionComponent },
            { path: 'non-fiction',  canActivate: [AuthGuardService], component: NonFictionComponent },
            { path: 'autobiographies',  canActivate: [AuthGuardService], component: AutoBiographiesComponent }
        ]
    }
];

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

В результате при загрузке приложения корневой маршрутизатор-розетка загружает маршрут маршрутов по умолчанию в самой верхней точке-маршрутизаторе, где я ожидаю маршрут mainApp изкорневые маршруты для отображения.Не совсем знаю, почему это происходит.

Если я изменю маршрут книги по умолчанию на не-по умолчанию (то есть изменим 

 path: ''

на 

 path: 'books'

), затем загружает маршрут по умолчанию ResArticlesModule.Если я тоже изменю маршрут по умолчанию, он загрузит маршрут по умолчанию «AuthorsModule».Поэтому по какой-то причине маршрутизатор загружает первый доступный дочерний маршрут по умолчанию, где ожидается корневой маршрут.

Я уверен, что это является ошибочно настроенной маршрутизацией с моей стороны.Может ли кто-нибудь помочь мне понять, что я делаю неправильно?

...