Ленивый загруженный базовый URL-адрес маршрута ведет себя странно

Я создал приложение с библиотекой компонентов. Моя библиотека содержит маршруты. Когда я пытаюсь лениво загрузить библиотеку в приложение, я использую следующий путь:

const routes: Routes = [
  { path: 'test2', loadChildren: () => import('my-lib' ).then(x => x.MyLibModule) },
];

Я импортирую этот маршрут в свой AppRoutingModule для приложения:

@NgModule({
 imports: [RouterModule.forRoot(routes)],
 exports: [RouterModule]
})

В библиотечном модуле MyLibModule я определяю свои библиотечные маршруты и импортирую их с помощью метода forChild.

imports: [
   ...
   RouterModule.forChild(routerConfig),
   ...
 ],

Это работает для моего маршрута по умолчанию. Если вы перейдете к базовому маршруту «localhost: 4200 / test2», маршрут библиотеки по умолчанию загрузится правильно. Однако при нажатии кнопки и переходе по другому маршруту база «test2» маршрутов библиотеки удаляется. Страница "localhost: 4200 / page2" загружается вместо "localhost: 4200 / test2 / page2". Этот URL не существует, и я получаю сообщение об ошибке. Однако, если вы перейдете к «localhost: 4200 / test2 / page2», загрузится правильная страница.

Что происходит с базовым URL-адресом test2 при перенаправлении? Как мне сохранить этот базовый URL без изменения кода в моей библиотеке?


angular ng-packagr
person afriedman111    schedule 13.12.2019    source источник
comment
Вы можете опубликовать свой routerConfig для ленивой загруженной библиотеки? Также можно опубликовать код или ссылку на маршрутизатор, которую вы используете для перехода на страницу 2?   -  person Chris Newman    schedule 13.12.2019
comment
вы можете показать метод, который обрабатывает нажатие кнопки?   -  person Jason White    schedule 13.12.2019
comment
он вызывается с помощью this.router.navigate ([местоположение]); где location = 'page2 / child'   -  person afriedman111    schedule 13.12.2019

Ответы (1)


arrow_upward
0
arrow_downward

Обновление 13.12.19 - используйте relativeTo

1) Вставьте ActivatedRoute в свой конструктор компонентов.

constructor(private router: Router, private route: ActivatedRoute) { }

2) Router.navigate() принимает второй параметр типа NavigationExtras. Установите свойство relativeTo, используя введенный маршрут.

this.router.navigate(['child'], {relativeTo: this.route});

StackBlitz demo

person Chris Newman    schedule 13.12.2019
comment
он вызывается с помощью this.router.navigate ([местоположение]); где location = 'page2 / child' - person afriedman111; 13.12.2019
comment
если location - это просто параметр String, который вы передаете функции, убедитесь, что эта строка имеет вид page2, а НЕ '/ page2'. Если перед строкой стоит начальный символ '/', вы попадете на localhost: 4200 / page2. - person Chris Newman; 13.12.2019
comment
Нет ведущего '/' - person afriedman111; 13.12.2019
comment
@AaronFriedman, проблема может заключаться в / в строке location. Попробуйте this.router.navigate(location.split('/')) - person Jason White; 13.12.2019
comment
Я попробовал разделить, но безуспешно. Он перешел на page2 / child. Не test2 / page2 / child - person afriedman111; 13.12.2019
comment
обновил ответ с помощью NavigationExtras и включил StackBlitz - person Chris Newman; 14.12.2019