2

I am trying to substitute an anchor tag with a button tag to navigate to another route. As a result, I have a function that is called on click, which looks something like this:

submitReport (simpleOrDetailed : string) {
        this.router.navigate(['../ticket-list', simpleOrDetailed]);
}

I used to have it like this embedded in the HTML and it worked perfectly fine: 

<a class="btn btn-danger" [routerLink]="['../ticket-list', 'simple']" routerLinkActive="active"> Simple Report</a>

What's going on here? From my understanding, it should be doing the exact same thing.

UPDATE

I got it to match my route by replacing the body of the function with this (web-report is the parent component of the current component as well as the ticket-list component):

this.router.navigate(['web-report/ticket-list', simpleOrDetailed]);

However, this causes an unpleasant page reload.

user812786
  • 4,302
  • 5
  • 38
  • 50
Alex Palacios
  • 389
  • 2
  • 4
  • 19

1 Answers1

1

If you do relative navigation you need to add relativeTo

this.router.navigate([crisis.id], { relativeTo: this.route });

https://angular.io/docs/ts/latest/guide/router.html

Günter Zöchbauer
  • 623,577
  • 216
  • 2,003
  • 1,567
  • I have tried the following to no avail: `this.router.navigate(['../ticket-list',simpleOrDetailed , {relativeTo: this.route}]);` Also: `this.router.navigate(['../ticket-list',simpleOrDetailed , {relativeTo: this.route.parent}]);` I am trying to go up a directory so that I can access the ticket list's component. – Alex Palacios Dec 02 '16 at 18:22
  • Well it seems this works: ` this.router.navigate(['../ticket-list', simpleOrDetailed], {relativeTo: this.route});` but I am still getting that awful page reload. If it's of any help, there are parameters related to an object I have in the url (which I did not intend on showing in there). – Alex Palacios Dec 02 '16 at 18:27
  • what is an umpleasant page reload? – Günter Zöchbauer Dec 02 '16 at 18:28
  • 1
    I have resolved the issue. Thanks! Here is the post that helped: http://stackoverflow.com/questions/38120756/angular2-router-navigate-refresh-page – Alex Palacios Dec 07 '16 at 12:46
  • Glad to hear :) – Günter Zöchbauer Dec 07 '16 at 12:49