Router navigate to child route - Angular 6

Question

I\'ve defined my routes like this:

const routes: Routes = [
    { path: \'\', loadChildren: \'./tabs/tabs.module#TabsPageModule\' },
    { path: \'faq\', lo         


        

Answer 1

It depends on from which component you wish to navigate from.

From Tabs to ListPage:

this.router.navigate(['/list'], {relativeTo: this.route});

If you're navigating from ProfilePage to ListPage (which are siblings) then, you need to use this:

this.router.navigate(['../list'], {relativeTo: this.route});

In the above code, route is the ActivatedRoute object and so it will enable relative navigation from current route. You can inject it in the constructor like this:

constructor(private route: ActivatedRoute)

I was also facing the same problem once and tried everything but nothing worked. In the end, Visual Studio Code's Intellisense helped me with this. Hope it helps somebody.