เปิดใช้งานการปัดใน TabView

หลังจากอ่านเกี่ยวกับ Gesture API แล้ว ฉันลงเอยด้วยการเพิ่มตัวฟังเหตุการณ์การปัดลงใน TabView:

HTML:

<TabView #tabview (swipe)="onSwipe($event)" androidTabsPosition="bottom">

    <page-router-outlet
        *tabItem="{title: 'Start', iconSource: getIconSource('play')}"
        name="startTab">
    </page-router-outlet>

    <page-router-outlet
        *tabItem="{title: 'Settings', iconSource: getIconSource('settings')}"
        name="settingsTab">
    </page-router-outlet>

</TabView>

พิมพ์สคริปต์:

@ViewChild("tabview") tabview!: ElementRef<TabView>;
...
  onSwipe(event: SwipeGestureEventData) {
    if (this.tabview.nativeElement.selectedIndex === 0 && event.direction === SwipeDirection.left){
      this.tabview.nativeElement.selectedIndex = 1;
    } else if(this.tabview.nativeElement.selectedIndex === 1 && event.direction === SwipeDirection.right){
      this.tabview.nativeElement.selectedIndex = 0;
    }
  }
...