router-link-active not working for nested routes

[choeller]

When working with nested routes, all links to routes under a common root-path get the router-link-active class. E.g having two links like this:

<li>
    <a [router-link]="['/Tasks', 'List']" class="link">Task Overview</a>
</li>
<li>
     <a [router-link]="['/Tasks', 'NewTask']" class="link">New Task</a>
</li>

navigating to "#/tasks/lists" results in the following DOM:

<li _ngcontent-sno-1="">
      <a class="link router-link-active" _ngcontent-sno-1="" href="#/tasks/list">Task Overview</a>
</li>

<li _ngcontent-sno-1="">
     <a class="link router-link-active" _ngcontent-sno-1="" href="#/tasks/new">New Task</a>
</li>

[choeller]

So here is a plnkr demonstrating the behaviour: http://plnkr.co/edit/wAzoCIWB23KQLGWw1EGB?p=preview

[zoechi]

I think this can be closed. This router is deprecated and this works differently in the new router.

[choeller]

Yeah, as of https://github.com/angular/vladivostok/issues/24 there might be a new solution for this, so I'll close this one...

[cchapman900]

I had a similar issue where my routerLinkActive wasn't being activated because I had my routerLink as /projects/{{project?._id}} in which case the project was originally starting as null.

I wrapped everything in a <div *ngIf="project"> and removed the ? and not it's working correctly.

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}