Eksakt adressamsvar i Angular

Attributtet routerLinkActive sjekker faktisk URL-en for delvis samsvar, ikke for eksakt samsvar. La oss for eksempel si at lenkene våre ser slik ut:

app/app.component.html<nav>
  <a
    routerLink="/blog/"
    routerLinkActive="active"
  >
    Aaaa
  </a>
  <a
    routerLink="/blog/page/"
    routerLinkActive="active"
  >
    Bbbb
  </a>
</nav>

I dette tilfellet, hvis vi er på URL-en /blog/page/, vil begge lenkene bli stiliserte.

For å tvinge lenkene til å sjekke etter eksakt adressesamsvar kan du bruke attributtet routerLinkActiveOptions. Se hvordan du bruker det:

app/app.component.html<nav>
  <a
    routerLink="/blog/"
    routerLinkActive="active"
    [routerLinkActiveOptions]="{exact:true}">
      Aaaa
  </a>
  <a
    routerLink="/blog/page/"
    routerLinkActive="active"
    [routerLinkActiveOptions]="{exact:true}">
      Aaaa
  </a>
</nav>