Forum | Appery.io

Hi, i need help to set icon-only on tabs in angular/ionic, in tabsitem properties only have: active, class, component name, and heading, exist another way to set this?

Thanks.

Hello,

You can do it with CSS, e.g.: add class "test" for that component
and add CSS like this:
pre.test a{
background-image:url(http://example.com/image.png);
}/pre

Hi,

I no need add image, i need add ion icons like ''icon ion-location" in each tab-item

this is div tab:

code
<div class="tabs rel-tabs" ng-transclude="">

<a style="" ng-click="select()" class="teste tab-item ng-binding active" ng-class="{active: active, disabled: disabled}" tab-heading-transclude=""><tab-heading>Info</tab-heading></a>

<a ng-click="select()" class="tab-item ng-binding" ng-class="{active: active, disabled: disabled}" tab-heading-transclude="">
<tab-heading>Pessoas</tab-heading>
</a>

<a ng-click="select()" class="tab-item ng-binding" ng-class="{active: active, disabled: disabled}" tab-heading-transclude="">
<tab-heading>Local</tab-heading>
</a>

<a ng-click="select()" class="tab-item ng-binding" ng-class="{active: active, disabled: disabled}" tab-heading-transclude="">
<tab-heading>Ingresso</tab-heading>
</a>

<>
/code

i need generate something like this:
code
<div class="tabs">
<a class="tab-item active" href="#">
<i class="icon ion-home"></i>
Test
</a>
<a class="tab-item" href="#">
<i class="icon ion-star"></i>
Favorites
</a>
<>
/code

Thanks

We are very sorry, but this is something outside the scope (http://devcenter.appery.io/support-po...) of our standard support.

Is there an easy way to change just the text of the tabs from the default "tab" text?(ionic app where you add the tabs component) It seems like you can only apply a class to the whole tabs component and not the individual tabs.