Как я могу перейти к дочерним маршрутам с отложенной загрузкой модуля?

#angular #angular2-routing

#angular #angular2-маршрутизация

Вопрос:

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

Я использую технику, как если бы это был загруженный модуль. Я объявил path, а внутри него — дочерние. Пожалуйста, посмотрите Файл маршрутизации ‘ModuleB’ в плунжере Кнопка ссылки пытается перейти к дочернему маршруту и загрузить CmpC. но это не удается.

Вот декаляция маршрутизации моего корневого модуля:

 { path: 'feature-b', loadChildren:'src/featureB/featureB.module#FeatureBModule' ,  pathMatch: 'full'}

Вот мое объявление маршрутизации лениво загруженного модуля.

 export const moduleBRoutes: Routes = [

  { path: '', component:CmpC , pathMatch: 'full',children:[
      {path: '' , pathMatch: 'full'},
      { path: 'c', component:CmpB , pathMatch: 'full'}
  ]},

];

export const subRouting: ModuleWithProviders = RouterModule.forChild(moduleBRoutes);

попытка перейти к: localhost:999/feature-b увенчалась успехом

попытка перейти к: localhost:999/feature-b / c не удалась

https://plnkr.co/edit/wFlJoDXRmAlMOswmwWFk?p=preview

Ответ №1:

У меня была такая же проблема, в моем случае ошибка не появляется, но представление не загружается, я могу решить проблему таким образом:

Это мой ленивый модуль

 const routes: Routes = [
  {
    path: ''
    },
    children: [
      { path: '', component: AdminComponent },
      { path: 'users', component: AdminUsersComponent },
      { path: 'games', component: AdminGamesComponent },
      { path: '**', redirectTo: '' }
    ]
  }
];

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

Это мой корневой модуль

 const routes: Routes = [
  {
    path: 'admin', loadChildren: 'app/admin/admin.module#AdminModule'
  }
];

@NgModule({
  imports: [RouterModule.forRoot(routes, { enableTracing: !environment.production })],
  exports: [RouterModule]
})
export class AppRoutingModule { }

Теперь маршруты:

администратор/
администратор / пользователи
администратор / игры

работает отлично

1. Но что, если вы хотите users (вместо admin/users ) перейти прямо к users пути в лениво загруженном модуле?

2. @CodyBugstein Я ищу что-то подобное, есть ли у вас какое-либо решение по этому поводу.

3. @CodyBugstein у вас может быть что-то вроде const routes: Routes = [{path: '', loadChildren: './test/test.module'}, {path: 'test2', component: Test2Component}]; в корневом модуле. Таким образом, если у вас есть эта конфигурация const routes: Routes = [{path: 'home', component: Test1Component}]; в ленивом модуле (тест), вы можете получить доступ к этому Test1Comp напрямую с помощью localhost:4200 /home

4. @saikiran пожалуйста, посмотрите на приведенный выше комментарий для вашего запроса

Ответ №2:

Рабочая демонстрация: https://plnkr.co/edit/xAGjXqpmkLbCokvCt9qQ?p=info

Удалено ненужное использование

 pathMatch:'full'

Не используйте его везде без какой-либо причины.

И теперь он работает так, как ожидалось.

подробнее об pathMatch этом здесь https://angular.io/docs/ts/latest/guide/router.html #!#перенаправление, https://angular.io/docs/ts/latest/api/router/index/Routes-type-alias.html

1. Он работает в вашем plunker, но в моей среде. Я получаю сообщение об ошибке: не удается сопоставить какие-либо маршруты: ‘feature-b / c’ есть идеи?

2. Пожалуйста, дважды проверьте plunke. Если он работает в plunker, он будет работать в вашей среде.

3. Как это отвечает на вопрос? Он спрашивал о переходе к пути внутри лениво загруженного модуля

4. Это также решило мою проблему (angular 6); Я использовал pathMatch: full в своем app.routes , и его удаление позволило правильно разрешить маршруты моего дочернего модуля внутри модуля.