Angular 20 Can't bind to 'routerLink' since it isn't a known property of 'a'

Question

Although I have used a previous stackoverflow solution, I still get the same error. The other problem is that there is no script in Angular 20 that has @NgModule. Here is the code I have:

navbar.html

    <li class="nav-item">
       <a class="nav-link" [routerLink]="['/']" [routerLinkActive]="['active']">Home</a>
    </li>
    <li class="nav-item">
       <a class="nav-link" [routerLink]="['/contact']" [routerLinkActive]="['active']">Contact</a>
    </li>

navbar.ts

    import { Component } from '@angular/core';
    
    @Component({
      selector: 'navbar',
      imports: [],
      templateUrl: './navbar.html',
      styleUrl: './navbar.scss'
    })
    
    export class Navbar {
    
    }

Related: In standalone mode, how to I import a module in Angular 17? — Karthik S
– Karthik S, Commented Jun 30 at 5:22
This question is similar to: Can't bind to 'routerLink' since it isn't a known property. If you believe it’s different, please edit the question, make it clear how it’s different and/or how the answers on that question are not helpful for your problem. — DarkBee
– DarkBee, Commented Jun 30 at 7:52
This solution is different from DarkBee's suggestion because Angular 20 doesn't have @NgModule, so you have to import RouterModule directly into the component you want to use it in. Karthik S found a similar solution, but it doesn't explicitly state RouterModule, however, it is implied that you can import it the same way as Angular 17. — JOEMface
– JOEMface, Commented Jul 6 at 1:08

JOEMface · Accepted Answer · 2025-06-30 01:04:17Z

0

Since Angular 20 doesn't have a script with @NgModule, you can just import the RouterModule per component like so:

import { Component } from '@angular/core';
import { RouterModule } from '@angular/router';

@Component({
  selector: 'navbar',
  imports: [RouterModule],
  templateUrl: './navbar.html',
  styleUrl: './navbar.scss'
})

export class Navbar {

}

That fixed the error of "Can't bind to 'routerLink' since it isn't a known property of 'a'"

edited Jun 30 at 1:04

answered Jun 30 at 0:58

JOEMface

293 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Angular 20 Can't bind to 'routerLink' since it isn't a known property of 'a'

1 Answer 1

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Linked

Related