Router navigate to child route - Angular 6

this.router.navigate(['/list'], {relativeTo: this.route});      //absolute
this.router.navigate(['./list'], {relativeTo: this.route});     //child
this.router.navigate(['../list'], {relativeTo: this.route});    //sibling
this.router.navigate(['../../list'], {relativeTo: this.route}); //parent
this.router.navigate(['tabs/list'], {relativeTo: this.route});
this.router.navigate(['/tabs/list'], {relativeTo: this.route});

You'll find here more information


If you want to navigate to the list route you need to make the angular know that its a child route of tabs

this.router.navigate(['/tabs/list']); or this.router.navigate(['tabs','list']);

In router navigate you need to pass routes as an array of string so now the angular will find for the parent tabs and checks the child route if it is nothing it will navigate to pathMatch: 'full' if not it will navigate to the specific child route

In routerLink you can use the same array to match the route

Thanks, Happy coding !!


Try:

this.router.navigate(['child component path'], {relativeTo: this.activatedRoute});

This solved my problem. Happy coding :)