Angular 6 how can I go back to parent then come to child in router.navigate()

Question

Hi I'm having parent component 'Order' and two child component for it 'History' and 'Orders'. Current url is order/history/id I want to go back to 'Orders' component like order/orders/id so I'm using Router in my app.

this.router.navigate(['../../orders', orderId]);

in history component as suggested in How do I navigate to a parent route from a child route? but it showing cannot match any routes url segment orders/7y6786 What is the best approach to solve this? Thank you.

Use `navigateByUrl` instead – Roberto Zvjerković Feb 26 '19 at 12:52 — Roberto Zvjerković, Feb 26 '19 at 12:52

score 2 · Accepted Answer · answered Feb 26 '19 at 16:11

As you are using the navigate inside a component, you may use the ActivatedRoute service.

So in you History Component, try to do this:

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

navigateToOrders() {
  this.router.navigate(['orders', orderId], { relativeTo: this.route.parent })
}

Angular 6 how can I go back to parent then come to child in router.navigate()

1 Answers1