Дакладнае супадзенне адрасоў у Angular

Атрыбут routerLinkActive на самой справе правярае URL не на дакладнае супадзенне, а на частковае. Хай для прыкладу нашы спасылкі выглядаюць так:

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

У гэтым выпадку, калі мы знаходзімся на ўрле /blog/page/ будуць стылізаваны абедзве спасылкі.

Прымусіць правяраць адрасы спасылак на дакладнае супадзенне можна з дапамогай атрыбута routerLinkActiveOptions. Глядзіце, як ім карыстацца:

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>