Ionicのドラッグ・ドロップ・ディレクティブを実装する方法は？

Question

//long-press.directive.d.ts

import { ElementRef, EventEmitter, OnDestroy, OnInit, NgZone } from '@angular/core'; 
import { Gesture } from 'ionic-angular/gestures/gesture'; 
export declare class LongPressDirective implements OnInit, OnDestroy { 
    zone: NgZone; 
    interval: number; 
    onPressStart: EventEmitter<any>; 
    onPressing: EventEmitter<any>; 
    onPressEnd: EventEmitter<any>; 

    el: HTMLElement; 
    pressGesture: Gesture; 
    int: any; 
    constructor(zone: NgZone, el: ElementRef); 
    ngOnInit(): void; 
    ngOnDestroy(): void; 
} 

//long-press.drective.js

"use strict"; 
Object.defineProperty(exports, "__esModule", { value: true }); 
var core_1 = require("@angular/core"); 
var gesture_1 = require("ionic-angular/gestures/gesture"); 
var LongPressDirective = (function() { 
    function LongPressDirective(zone, el) { 
     this.zone = zone; 
     this.onPressStart = new core_1.EventEmitter(); 
     this.onPressing = new core_1.EventEmitter(); 
     this.onPressEnd = new core_1.EventEmitter(); 
     this.el = el.nativeElement; 
    } 
    LongPressDirective.prototype.ngOnInit = function() { 
     var _this = this; 
     if (!this.interval) 
      this.interval = 500; 
     if (this.interval < 40) { 
      throw new Error('A limit of 40ms is imposed so you don\'t destroy device performance. If you need less than a 40ms interval, please file an issue explaining your use case.'); 
     } 
     this.pressGesture = new gesture_1.Gesture(this.el); 
     this.pressGesture.listen(); 
     this.pressGesture.on('press', function (e) { 
      _this.onPressStart.emit(e); 
      _this.zone.run(function() { 
       _this.int = setInterval(function() { 
        _this.onPressing.emit(); 
       }, _this.interval); 
      }); 
     }); 

     this.pressGesture.on('pressup', function (e) { 
      _this.zone.run(function() { 
       clearInterval(_this.int); 
      }); 
      _this.onPressEnd.emit(); 
     }); 




    }; 
    LongPressDirective.prototype.ngOnDestroy = function() { 
     var _this = this; 
     this.zone.run(function() { 
      clearInterval(_this.int); 
     }); 
     this.onPressEnd.emit(); 
     this.pressGesture.destroy(); 
    }; 
    return LongPressDirective; 
}()); 
LongPressDirective.decorators = [ 
    { type: core_1.Directive, args: [{ 
       selector: '[ion-long-press]' 
      },] }, 
]; 
/** @nocollapse */ 
LongPressDirective.ctorParameters = function() { return [ 
    { type: core_1.NgZone, }, 
    { type: core_1.ElementRef, }, 
]; }; 
LongPressDirective.propDecorators = { 
    'interval': [{ type: core_1.Input },], 
    'onPressStart': [{ type: core_1.Output },], 
    'onPressing': [{ type: core_1.Output },], 
    'onPressEnd': [{ type: core_1.Output },], 
}; 
exports.LongPressDirective = LongPressDirective; 
//# sourceMappingURL=long-press.directive.js.map 

これは、 'プレス'、 'プレス・アップ' イベントを実装したものです。 この指令は、イオニックが長時間押すために使用する既存のHammer.JSプレスイベントを、間隔放出を与えることで構築しようとしています。 https://www.npmjs.com/package/ionic-long-press 'ドラッグ' - 'ドロップ'イベントを追加します。 私は角度の初心者です。 エキスパートのヘルプが必要です。おかげさまで

Answer 1

このプラグインを使用して問題を解決しました。 https://github.com/AbineshSrishti/ionic2-selection-card-drag