Error: Cannot match any routes. URL Segment: 'homePage'

12.6k Views Asked by At

I want to go to the home page after login button is clicked, but I keep getting the error :

Error: Cannot match any routes. URL Segment: 'homePage'

This are my routes:

{
  path: 'homePage',
  component: HomePageComponent,
  outlet:'homePage'
},
{ 
  path: 'login',
  component:LoginComponent
},  
{ 
  path: '',
  redirectTo: '/login',
  pathMatch: 'full'
} 

And this is the button to be clicked:

<button routerLink="homePage" id="login" md-button>Log in</button>
<router-outlet name="homePage"></router-outlet>
2

There are 2 best solutions below

7
On BEST ANSWER

You have to tell the router to route inside your named outlet like this:

<button [routerLink]="[{ outlets:{ homePage: ['homePage']} }]">
  Edit
</button>

More about routing with named outlets can be found here.


As stated by me in the comments of this answer, it sounds like you just want to have a simple unnamed router outlet.

Make sure you have only one outlet inside your app component's template:

<router-outlet></router-outlet>

And then remove the outlet property from your route:

{
    path: 'homePage',
    component: HomePageComponent
}

And for the router link just use

<button routerLink="/homePage></button>
1
On

Try changing

<button routerLink="homePage">

to

<button routerLink="/homePage"