How to disable a tab item?

#1

Hello everyone,

is it possible to disable a tab item in ion-tabs? I also want to style the selected item. Is there something out-of-the-box or do I have to manipulate the DOM?

#2

Yes, you can disable a tab item, see Tab docs. enabled="false" does the trick, see below.

<ion-tabs> <ion-tab tabIcon="heart" [root]="tab1"></ion-tab> <ion-tab tabIcon="star" [root]="tab2" enabled="false"></ion-tab> </ion-tabs>

The button belonging to the selected Tab has an .activated class as well as an aria-selected="true" attribute you can use to style it. You can figure this out by using e.g. the Chrome Inspector to inspect the selected element.

1 Like
#3

@vklinghammer Was going crazy looking at the Tabs doc instead of the Tab doc. Thanks.