Angular - перенаправить на один и тот же компонент с другим параметром - PullRequest
Новая
       20

Angular - перенаправить на один и тот же компонент с другим параметром

0 голосов
/ 11 декабря 2018

Итак, в угловой я вложил маршрутизацию, скажем: 

domain.com/dashboard/list/:listId/:listName/details/:detailsName/:detailsId

  • Панель инструментов - это отдельный модуль

  • Список - это отдельный модуль

  • Подробности - это отдельный модуль

Теперь, на странице details, у меня также есть небольшой компонент с похожим спискомна странице list, и поэтому я также хочу перенаправить пользователя на тот же компонент details, но с другими параметрами.

Итак, давайте с: 

domain.com/dashboard/list/1/test_list_name/details/test_details_name/4

на 

domain.com/dashboard/list/1/test_list_name/details/another_test_details_name/8

RouterLink: 

<h5 [routerLink]="['details', id, name]"></h5>

К сожалению, меня всегда перенаправляют на /dashboard.Я попробовал это также с установкой routeReuseStrategy в false.Но безуспешно.

Что я делаю не так?

@ Edit, stackblitz:

https://stackblitz.com/edit/angular-q8fasa

InПример stackblitz Я просто хочу открыть еще один компонент второй панели (с другими параметрами) из компонента второй панели.В этом примере я использовал только одну вложенную маршрутизацию, но проблемы точно такие же.

Извините за довольно уродливый пример, но я верю, что вы поймете мою проблему.

1 Ответ

0 голосов
/ 12 декабря 2018

Используя RouterModule.forRoot(routes, { enableTracing: true }), я вижу в консоли следующее:

Event: NavigationEnd NavigationEnd(id: 3, url: '/dashboard/dashboard-second/original-name-something-bla-bla/87/dashboard-second/other-name/11', urlAfterRedirects: '/dashboard') NavigationEnd {id: 3, url: "/dashboard/dashboard-second/original-name-something-bla-bla/87/dashboard-second/other-name/11", urlAfterRedirects: "/dashboard"}

Так что у него есть dashboard-second дважды.

Мне пришлось изменитьмаршрутизатор ссылается на: 

<h5 [routerLink]="['../../../../dashboard-second', 'other-name', 11]" >Go to dashboard-second 1</h5>

Устраняет проблему.4 .. это вернуться к /dashboard.Каждый .. перейти к:

  1. 87 (то есть: / 87 / .. = / 87)
  2. оригинальное имя-что-то-бла-бла
  3. dashboard-second
  4. / dashboard

Немного не интуитивно понятно, что это занимает 4 .., я думал, что это заняло бы 3, но это имеет смысл, потому что это относительно.Таким образом, вы в конечном итоге делаете:

/dashboard/dashboard-second/original-name-something-bla-bla/87/../../../../dashboard-second/other-name/11

, который разрешается в:

/dashboard/dashboard-second/other-name/11

Вы также можете установить абсолютный путь с помощьюпредупредите, что если вы перемещаете маршрут / приборную панель в секунду, более вероятно, что вам придется обновить routerLink при использовании абсолютных путей: 

<h5 [routerLink]="['/dashboard/dashboard-second', 'name-name-name', 13]" >Go to dashboard-second 3</h5>
...