Potrivirea exactă a adreselor în Angular

Atributul routerLinkActive de fapt verifică URL-ul nu pentru o potrivire exactă, ci pentru una parțială. Să presupunem, de exemplu, că linkurile noastre arată astfel:

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

În acest caz, dacă ne aflăm la URL-ul /blog/page/, ambele linkuri vor fi stilizate.

Puteți forța verificarea adreselor linkurilor pentru o potrivire exactă folosind atributul routerLinkActiveOptions. Uitați-vă cum să îl folosiți:

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>