Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Angular 2 relative pathing from siblings doesn't work #14480

Closed
InglishSK opened this issue Feb 14, 2017 · 2 comments
Closed

Angular 2 relative pathing from siblings doesn't work #14480

InglishSK opened this issue Feb 14, 2017 · 2 comments

Comments

@InglishSK
Copy link

InglishSK commented Feb 14, 2017

I'm submitting a ... (check one with "x")

[X ] bug report => search github for a similar issue or PR before submitting
[ ] feature request
[ ] support request => Please do not submit support request here, instead see https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question

Current behavior
A routed component cannot use a relative path to navigate to another component; whether from the primary changing the named router outlet, or from a named router changing the primary.
The issue is written up here.
The closest routerLink syntax to navigating to a new named router outlet component is:
<a [routerLink]="['', {outlets: {aux: ['details']}}]">Details</a>
However, when a routed component is already in the aux named route, this routerLink produces an extra set of parenthesis.

auth/portfolio/(home/1//aux:details)(aux:details)

If a routed component isn't already in the aux named route, then the url generated is malformed anyway.

auth/portfolio/(home/1)(aux:details)

Expected behavior
I would expect to be able to change to another route via a routerLink like the documentation says, regardless of the depth I am in the URL tree.

Minimal reproduction of the problem with instructions
https://plnkr.co/edit/uoUBG6yDfNb6P0oLKN16?p=preview

What is the motivation / use case for changing the behavior?
We have an application where the named router outlet is used to display lists of entities. Upon selecting an entity, the application replaces the primary router outlet with the details of the entity. Entity details control which lists are available, so navigation occurs in the primary router outlet to change which component is showing in the named router outlet.

Please tell us about your environment:
Azure App Services

@atscott
Copy link
Contributor

atscott commented Nov 3, 2020

Closing as duplicate of #13523, #26672, #13523

Some of the issues may also have been addressed in #39456, where the aux outlets were being ignored if a primary outlet was defined in the map.
Much of this is actually working as intended. One thing to be aware of is that routerLink generates urls relative to the current activated route. So given a config like

{
    path: "auth/:module",
    component: AuthComponent,
    children: [
      { path: "home/:value", component: HomeComponent },
      { path: "home2/:value", component: Home2Component },
      { path: "details", component: DetailComponent, outlet: "aux" },
      { path: "details2", component: Detail2Component, outlet: "aux" }
    ]
  }

in order to have a routerLink add the aux outlet if it is part of HomeComponent, the commands need to be <a [routerLink]="['../../', { outlets: { aux: ['details'] } }]">Details</a>. That is, given the existing route auth/portfolio/home/1, move two segments up to auth/portfolio, then apply the commands: Add 'aux:details' to the route and do not change the primary outlet. Updated example: https://stackblitz.com/edit/angular-ivy-tcmuja?file=src%2Fapp%2Fhome.component.ts (note that I only changed the routerLink on the HomeComponent)

@atscott atscott closed this as completed Nov 3, 2020
@angular-automatic-lock-bot
Copy link

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Dec 4, 2020
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

No branches or pull requests

5 participants