FAB在Ionic和事件中的选项卡栏上

Question

我需要能够将FAB放在Ionic的标签栏上。我已经成功做到了。

这是在我的Home组件（home.html和home.ts）中完成的。标签栏声明为：

<ion-tabs color="tabbar">
  <ion-tab [root]="dashboard" tabIcon="home" tabTitle="Home"></ion-tab>
  <ion-tab [root]="activity" tabIcon="trending-up" tabTitle="Activity">   
</ion-tab>
  <ion-fab center bottom>
    <button ion-fab large (click)="showTransferOptions($event)">Transfer</button>
  </ion-fab>
  <ion-tab [root]="transfer" tabIcon="deliberately_invalid" tabTitle="">     
</ion-tab>
  <ion-tab [root]="contacts" tabIcon="contacts" tabTitle="Contacts"> 
</ion-tab>
  <ion-tab [root]="settings" tabIcon="cog" tabTitle="Settings"></ion-tab>
</ion-tabs>

我的home.ts作为声明的函数：

showTransferOptions(event) {
  console.log(event);
}

但是我得到这个错误：

ERROR TypeError: co.showTransferOptions is not a function

我对Ionic有点陌生，所以我不确定为什么它没有约束力。我以为'Home'组件后面有一个控制器，可以像这样进行mkae绑定？

干杯， 本

Answer 1

从选项卡的根目录导航时，请勿使用NavController，App来自ionic-angular的{​​{1}}这样的this.appCtrl.getRootNav().push('Pagetogoto');会完全删除tabs.html和隐藏Fab