ionic 2アイテムスライダ - トリガー機能を起動するためのスライド

Question

3つのボタン付きionic-item-slidingディレクティブがあります。 2（AとB）左にスライドすると表示され、1（ボタンC）は右に表示されます。

実際にボタンを右端にドラッグすると、ボタンCの下の関数がトリガされるという動作を実装したいと思います。 ionic2 hompage上

ドキュメントは

<ion-item-sliding *ngFor="let item of items "(ionDrag)="ondrag($event, item)"></ion-item-sliding> 

私はあまりにも遠くにスワイプすると、それが呼び出すと、プッシュすること振る舞いを取得してきた上で、それを使用した例

ondrag(event, item) { 
    let percent = event.getSlidingPercent(); 
    if (percent > 0) { 
    // positive 
    console.log('right side'); 
    } else { 
    // negative 
    console.log('left side'); 
    } 
    if (Math.abs(percent) > 1) { 
     this.navCtrl.push(NextPage,{param:item},{ animate: true, direction: 'forward' }) 
    } 
} 

として、このコードスニペットを与えますページを複数回（私は多くのイベントを私は投げていると思います）

これを正しく実装する方法に関する提案はありますか？

ありがとうございます！

Answer 1

push()メソッドが1回だけ実行されるようにフラグを追加できます。

import { Component } from "@angular/core"; 
import { NavController } from 'ionic-angular/index'; 
import { Page1 } from 'page1.ts'; 

@Component({ 
    templateUrl:"home.html" 
}) 
export class HomePage { 

    private alreadyPushed: boolean; 

    private items: Array<any>; 

    private selectedItem: any; 

    constructor(private navCtrl: NavController) { 
    this.items = [ 
     'City of Amsterdam', 
     'City of Bogota', 
     'City of Buenos Aires', 
     'City of Dhaka' 
    ]; 
    } 

    ionViewDidEnter() { 
    // Initialize the flag 
    this.alreadyPushed = false; 

    if(this.selectedItem) { 
     // Reset the selected item 
     this.selectedItem._setOpenAmount(0); 
    } 

    } 

    ondrag(event, item) { 
    let percent = event.getSlidingPercent(); 
    if (percent > 1 && !this.alreadyPushed) { 

     // Store the event to reset it later 
     this.selectedItem = event; 

     // Set the flag to true 
     this.alreadyPushed = true; 

     // Push the new page 
     this.navCtrl.push(Page1, { param : item }); 
    } 
    } 
} 

はまた、あなたが右にスライドするときに、あなただけのページをプッシュpercent > 1代わりのMath.abs(percent) > 1を使用する必要があることを何卒ご了承下さい。