I am using the angular 10 version I have an issue with the routerLinkActive it is setting the home URL (base URL) to active even if the route is on another page.
<li class="nav-item">
<a class="nav-link" [routerLink]='[""]' routerLinkActive='active'>Home</a>
</li>
<li class="nav-item">
<a class="nav-link" [routerLink]='["/contact-us"]' routerLinkActive='active'>Contact Us</a>
</li>
I believe you need to use [routerLinkActiveOptions] in your template page.
[routerLinkActiveOptions]="{exact:true}"
Set the above [routerLinkActiveOptions] directive to all navigation links, which will add the routerLinkActive class to only those navigation links which match the entire URL.
pre
& code
tags ):