Search code examples
angularangular4-routerrouterlink

RouterLink Does not Work Correctly


I have 2 components 1 for navigation and one for the contant of the page , RouterLink add the route path to the current routes for example if this routes

    {path:'home',component:HomeComponent},
    {path:'mygames/:id',component:UsergamesComponent}

And this the routerLink code

  <li class="treeview" routerLinkActive="active" >
      <a [routerLink]="['mygames',user_ob.user_id]">
        <i class="fa fa-user"></i> <span>My Games</span>
      </a>
    </li>

When I navigate to home Route or any thing else and I want to Go to mygames route suppose the link will be localhost:4200/mygames/id but
The routerlink is

localhost:4200/home/mygames/user_id

or even on the home route The routerLink for this route is

localhost:4200/home/home 

I do not Know what is the problem hear and how to fix it


Solution

  • routerLink can be use as

     <a routerLink="/mygames/{{user_ob.user_id}}">
    

    or

     <a [routerLink]="['/mygames',user_ob.user_id]">
    

    more on Angular DOC