离子工厂列表开放，关闭事件

1 回答

• 1

  看起来Ionic不提供用于监听这些事件的API，但您可以像这样轻松添加它：

  <ion-fab left bottom> <!-- Bind the click event here -->
    <button (tap)="fabToggled()" ion-fab mini>
      <ion-icon name="add"></ion-icon>
    </button>
    <ion-fab-list side="top">
      <button ion-fab (tap)="changeMap('SATELLITE')">
        <ion-icon name="map"></ion-icon>
        <div class="label-map">Satellite</div>
      </button>
      <button ion-fab (tap)="changeMap('HYBRID')">
        <ion-icon name="map-map"></ion-icon>
        <div class="label-map">Hybrid</div>
      </button>
      <button ion-fab (tap)="changeMap('NONE')">
        <ion-icon name="map-map"> </ion-icon>
        <div class="label-map">None</div>
      </button>
    </ion-fab-list>
  </ion-fab>
  

  然后在组件代码中添加以下内容：

  // It's closed by default
  private isOpened: boolean = false;
  
  public fabToggled(): void {
      this.isOpened = !this.isOpened;
  
      if(this.isOpened) {
          console.log('Opened...');
      } else {
          console.log('Closed...');
      }
  }
  

  回复于 2024-05-18T13:08:15+08:00