CODEWITHSUNDEEP
angularangular-material
Daniel T.
Daniel T.

Reputation: 489

Selection animation doesn't work for Angular (7) Material Tabs

I tried to implement Angular Material Tabs with routing, everything works fine just that the underline animation doesn't work. It just remains stuck on first tab and disappears after. I have the animations and default theme installed as suggested here:

Angular material tab animation doesn't work

and used the code as in the Documentation:

<nav mat-tab-nav-bar>
  <a mat-tab-link
      routerLink="home"
      routerLinkActive #rla="routerLinkActive"
      [active]="rla.isActive">
      home
  </a>
  <a mat-tab-link
      routerLink="about"
      routerLinkActive #rla="routerLinkActive"
      [active]="rla.isActive">
      about
  </a>
</nav>

<router-outlet></router-outlet>

Upvotes: 2

Views: 289

Answers (1)

Adrita Sharma
Adrita Sharma

Reputation: 22213

Try this:

<a mat-tab-link
      routerLink="about"
      routerLinkActive #rla="routerLinkActive"
      routerLinkActive="active"
      [active]="rla.isActive">
      about
</a>

CSS:

.active{
}

Upvotes: 2

Related Questions