Angular 8, как я могу использовать маршрут основной розетки, когда я нахожусь в другой розетке маршрутизатора

извините, я новичок в Angular и не очень хорошо понимаю, как работает розетка маршрутизатора.

    {path: 'organisation/:orga_id/event/:event_id', component: EventAdminComponent, children: [
            {path: 'general', component: GeneralComponent, outlet: 'tab'},
            {path: 'tickets', component: TicketsComponent, outlet: 'tab'},
            {path: 'commandes', component: TestSecondComponent, outlet: 'tab'},
            {path: 'stat', component: TestSecondComponent, outlet: 'tab'}
        ]},
    {path: 'organisation/:orga_id/event/:event_id/status-people/:ticket_id', component: StatusPeopleComponent},

Итак, это мой app-routing.ts, я использовал выход маршрутизатора вкладок на странице, мой маршрут в настоящее время:

http://localhost:4200/admin/organisation/KHY1ODY0ZDUx/event/GKniQWmuVDM2/(tab:tickets)

Как вы можете видеть, я нахожусь на вкладке с названием розетки маршрутизатора, и мне нужно следующее: Откуда я возвращаюсь к основной розетке и перехожу по этому URL-адресу:

http://localhost:4200/admin/organisation/KHY1ODY0ZDUx/event/GKniQWmuVDM2/status-people/:ticket-id

Я много чего пробовал с routerLink, но ничего не получалось, может кто-нибудь объяснить мне, как мне это сделать?


angular router outlet
person Jules Pauly    schedule 08.11.2019    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Вместо того, чтобы пытаться напрямую перейти по URL-адресу:

[routerLink]="['/foo/bar']"

вам нужно настроить розетки вручную, например так:

[routerLink]="[{ outlets: { primary: '/foo/bar', tab: null } }]"

Это откроет '/foo/bar' на выходе primary и очистит выход tab.

person sloth    schedule 08.11.2019
comment
Спасибо за ответ, я попробовал ваше решение и получил такой URL: localhost: 4200 / admin / organization / KHY1ODY0ZDUx / event / - person Jules Pauly; 08.11.2019
comment
Как выглядит ваш routerLink-value? - person sloth; 08.11.2019
comment
[routerLink]= "[{ outlets: { primary: '/admin/organisation/' + manageEvent.orgaId + '/event/' + manageEvent.eventId + '/status-people/' + item.id, tab: null } }]">. И результатом этого значения является URL-адрес выше. - person Jules Pauly; 08.11.2019