Q:

How to implement drag-drop directive for Ionic?

//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

This is implementation of 'press', 'press-up' event.
This directive intends to build upon the existing Hammer.JS press event that Ionic uses for long pressing, by giving you interval emission.
https://www.npmjs.com/package/ionic-long-press
 I want to add 'drag'-'drop' event.
I am beginner of angular.
Expert's help is needed.
Thanks.

A:

I solved the problem using this plugin.
https://github.com/AbineshSrishti/ionic2-selection-card-drag

