doorman
doorman

Reputation: 16949

How to use routerLinkActive with empty routerLink

I have the following tab bar links and the first one is supposed to be empty:

<nav md-tab-nav-bar>
          <a md-tab-link [routerLink]="'./'" 
             routerLinkActive #rla="routerLinkActive" [active]="rla.isActive">
            My tab
          </a>
...
</nav>

The link works fine but the active state is not triggered.

What is the proper way to handle empty routerlink for the tab to be activated?

Upvotes: 11

Views: 16183

Answers (1)

Dmitrij Kuba
Dmitrij Kuba

Reputation: 1038

Try this instead

<a [routerLink]=" ['./'] "
    routerLinkActive="active" [routerLinkActiveOptions]= "{exact: true}">
    My tab
</a>

https://angular.io/docs/ts/latest/api/router/index/RouterLinkActive-directive.html

Upvotes: 33

Related Questions