Search code examples
angularservicestackasp.net-core-2.1

Nothing happens when clicking on routerLink href in Angular 6.1

Nothing happens when I click on the route defined in the following way.

<li>
    <a class="nav-link" routerLink="/about" routerLinkActive="active">About Us</a>
</li>

<router-outlet></router-outlet>

is in the app.component.html file (which is where the routerlink is) 

{ path: 'about/', component: AboutComponent }

is added to the routes in app.module.ts. 

import { ActivatedRoute } from '@angular/router';

is imported in the about.component.

Is there some obvious thing that I am missing?

Solution

  • The name you are using in app.component.html has a / character.

    You have two options

    1. (recommended): just delete that character.

      { path: 'about', component: AboutComponent }

    2. Just add it in the routerLink:

      <a class="nav-link" routerLink="/about/" routerLinkActive="active">About Us</a>