У меня есть приложение, которое показывает список контактов с возможностью выбора одного контакта и просмотра его деталей. На странице сведений о контакте есть несколько вкладок для дополнительной информации о контакте (профиль, точки взаимодействия и контактная информация). Вот подходящие URL-адреса:
Чтобы просмотреть список контактов:
Чтобы увидеть все точки соприкосновения для данного контакта
Вот данные маршрутизации, которые составляют маршрут для списка контактов, а также маршруты отложенной загрузки для контактных данных:
export const routing: ModuleWithProviders = RouterModule.forChild(
[
{
path: 'list',
component: PageContactListComponent
},
//... other routes here...
{
path: ':id',
component: PageContactDetailComponent,
children:
[
//... other routes here...
//LAZY LOADED:
{ path: 'touch-points', loadChildren: './detail/components/touch-points/touch-points.module#TouchPointModule' } ]
}
]);
Вот данные маршрутизации для модуля точек соприкосновения.
export const routing:ModuleWithProviders = RouterModule.forChild(
[
{
path: '',
pathMatch: 'full',
redirectTo: 'list'
},
{
path: 'list',
component: TouchPointListComponent
}
]);
Когда я перехожу к http://localhost:4200/contact/list, Angular пытается загрузить компонент, связанный с http://localhost:4200/contact/84/touch-points/list. Кажется, это происходит потому, что «список» также определен в модуле с отложенной загрузкой. Если я изменю «список» на «историю» в данных маршрутизации для модуля точек соприкосновения, http://localhost:4200/contact/list загрузит соответствующий компонент.
Маршрутизатор Angular 4 должен уметь различать эти маршруты: (http://localhost:4200/contact/list, http://localhost:4200/contact/84/touch-points/list) и загружать соответствующий компонент.
Какие изменения мне нужно внести в определения моих маршрутов, чтобы упростить использование «списка» на нескольких маршрутах в одной функциональной области (т. Е. В контактах)?
--- ОБНОВЛЕНИЕ 01.08.2017 ---
Я создал следующий плункер, демонстрирующий эту проблему:
Щелчок по ссылке «Список контактов» в плункере загружает список точек соприкосновения вместо загрузки списка контактов. Touch Points - это модуль с отложенной загрузкой внутри домена Contact.
Что должно произойти, так это перейти к списку контактов. Нажав на контакт, вы перейдете на страницу сведений о контакте, где сможете щелкнуть ссылку точки касания, чтобы просмотреть список точек соприкосновения для выбранного контакта.
Маршрут списка контактного модуля (/contact/list) использует «список» для своего маршрута. Маршрут списка точек соприкосновения должен быть /contact/:id/touch-points/list. Поскольку list используется в обоих маршрутах, последний определенный маршрут переопределяет первый маршрут, и впоследствии компонент для списка точек соприкосновения загружается при переходе к маршруту /contact/list.
Спасибо.
