Search code examples
angularangular-routingngx-bootstrap

Router Navigate to ngx-bootstrap tabs Angular 4

I have a component with four tabs (using ngx-bootstrap tabs) myprod,mysettings,etc. and I created four different routing for each tab(pointed to same component). and I used the below code for show the right tab on page load.

[routerLink]="['/user/my-account']" [routerLinkActive]="'active is-active'"

but unfortunately everytime the active class will add to the first to tab not the right one. If I use any other class name instead of active it works as I expected, please help.

enter image description here

enter image description here

Solution

  • try this 

     <tab   
  [routerLink]="['/user/my-account']"
  routerLinkActive 
  #ads="routerLinkActive"
  [active]="ads.isActive">  
</tab>