CODEWITHSUNDEEP
angularangular-materialmat-tab
ntrch
ntrch

Reputation: 96

Material tabs change to last tab when selectedIndex is higher than the actual number of tabs

For example, I have 2 tabs in my mat-tab-group:

<mat-tab-group>
  <mat-tab>
  </mat-tab>
  <mat-tab>
  </mat-tab>
</mat-tab-group>

Let's say the first tab is chosen (index 0), when I change selectedIndex to 2 (which should switch to tab 3 but it doesn't exist) the second tab is chosen. I want the first tab to remain selected because the index was out of range. How can I do that? (For a generic case: n number of tabs, one of them selected (not necessarily the first or last one, and selectedIndex>n)

Upvotes: 1

Views: 309

Answers (1)

AddWeb Solution Pvt Ltd
AddWeb Solution Pvt Ltd

Reputation: 21681

Try this:

In TS:

let index = this.Activeroute.snapshot.queryParams['index'];

if(selectedIndex > n)
{
   this.selectedIndex = 0;
}
else
{
   this.selectedIndex = index;
}

Upvotes: 1

Related Questions