Tabs are taking Double Tap


#1

Hello,

I am using tabs in my application. Tabs are giving me issue. Whenever i tap on any tab, it changes but the icon is not showing active. On the double tab, icon start showing active.

HTML:

<ion-tabs>
  <ion-tab [root]="home" tabTitle="HOME" tabIcon="home"></ion-tab>
  <ion-tab [root]="shop" tabTitle="SHOP" tabIcon="shop"></ion-tab>
  <ion-tab [root]="services" tabTitle="SERVICES" tabIcon="services"></ion-tab>
  <ion-tab [root]="checkout" tabTitle="CHECKOUT" tabIcon="checkout"></ion-tab>
  <ion-tab [root]="account" tabTitle="ACCOUNT" tabIcon="account"></ion-tab>
</ion-tabs>

TS:

@Component({
  templateUrl: 'tabs.html'
})
export class TabsPage {

  home = MainPage;
  shop = Shop;
  services = Services;
  checkout = Checkout;
  account = Account;

  constructor() {
  }

}

Please let me know if anyone know what’s the issue is.


#2

Which version of ionic-angular are you on?


#3

“ionic-angular”: “3.0.1”,


#4

Could you upgrade to the newest version (3.1.1) and try again? There were some issues with tapping on tabs in that version which are fixed by the latest release.


#5

Okay, Sure. Thanks, I will upgrade and check if it solve my issue or not.


#6

Hello @luukschoen,

As you said i have updated angular version to 3.2.0(latest). But now i am getting more issue with tabs. Tab active only work once after one tap it stops working. Below is my ionic info:

global packages:

@ionic/cli-utils : 1.0.0
Cordova CLI      : 6.5.0
Ionic CLI        : 3.0.0

local packages:

@ionic/app-scripts              : 1.3.7
@ionic/cli-plugin-cordova       : 1.0.0
@ionic/cli-plugin-ionic-angular : 1.0.0
Ionic Framework                 : ionic-angular 3.2.0

System:

Node       : v6.9.2
OS         : Windows 8.1
Xcode      : not installed
ios-deploy : not installed
ios-sim    : not installed

#7

I got the issue. Thanks for your help.


#8

Okay, could you please report back to us what your issue actually was? Maybe it can benefit others :slight_smile:


#9

That was a formbuilder code issue on that particular tab/page. So i just solved formbuilder issue and everything is working fine now.


#10

Hi @luukschoen please help me with this issue.