Përputhja e saktë e adresave në Angular

Atributi routerLinkActive në fakt kontrollon URL jo për përputhje të saktë, por për përputhje të pjesshme. Le të themi për shembull se lidhjet tona duken kështu:

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

Në këtë rast, nëse jemi në URL /blog/page/ të dyja lidhjet do të jenë të stiliuara.

Për të detyruar kontrollin e adresave të lidhjeve për përputhje të saktë mund të përdorni atributin routerLinkActiveOptions. Shikoni se si të përdoret:

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>