Ionic framework 在Ionic 4中自动隐藏浮动操作按钮

我想在用户scrollToBottom时显示scrollToTop按钮，当用户位于顶部时，只显示scrollToBottom。如何管理按钮请帮助我…这是我的截图请帮助我如何管理这些按钮

表1.page.ts

    <ion-content cache-view="false" (ionScrollStart)="logScrollStart()" (ionScroll)="logScrolling($event)"
  (ionScrollEnd)="logScrollEnd()" [scrollEvents]="true">

  <ion-fab vertical="bottom" horizontal="end" slot="fixed">
      <ion-fab-button *ngIf="showToolbar" (click)="ScrollToTop($event)">
        <ion-icon name="arrow-dropup"></ion-icon>
      </ion-fab-button>
    </ion-fab>

    <ion-fab vertical="top" horizontal="end" slot="fixed">
      <ion-fab-button  (click)="ScrollToBottom($event)">
        <ion-icon name="arrow-dropdown"></ion-icon>
      </ion-fab-button>
    </ion-fab>

</ion-content>

也许这有帮助

及

ScrollToTop（事件）{
this.content.ionScrollEnd.subscribe（（数据）=>{
if（this.content）{
//控制台日志（数据）；
this.showToolbar=true；
}
});
this.content.scrollToTop（1500）；
this.showBottom=true；
this.showTop=false；
}
ScrollToBottom（）{
这个.content.scrollToBottom（1500）；
this.showTop=true；
this.showBottom=false；
}

this.showTop=true；this.showBottom=false；如何在构造函数add之前设置变量tab1.page.ts：showTop=false；showBottom=true；

 ScrollToTop(event){
    this.content.ionScrollEnd.subscribe((data)=>{
      if(this.content){
        //console.log(data);
       this.showToolbar = true;
      }
     });
    this.content.scrollToTop(1500);

  }
  ScrollToBottom(){
    this.content.scrollToBottom(1500);
  }
  logScrollStart(){

   // console.log("logScrollStart : When Scroll Starts");
  }

  logScrolling(){


  }

  logScrollEnd(){
    this.content.ionScrollEnd.subscribe((data)=>{
      if(this.content){
        //console.log(data);
       this.showToolbar = true;
      }
     });