Hold on element to toggle class

Hi - I need to show images blurred. If a user holds down on the image then the image unblurs until they move off. This is done by toggling a class on the image. I have attempted to use a custom directive to no avail. It doesn’t work if you drag off the image, because the release isn’t detected.

import { Directive, ElementRef, OnInit, OnDestroy, Output, EventEmitter } from '@angular/core';
import { Gesture } from "ionic-angular/gestures/gesture";

@Directive({
    selector: '[long-press]'
})
export class PressDirective implements OnInit, OnDestroy {
    el: HTMLElement;
    pressGesture: Gesture;
    @Output('long-press') onPressRelease: EventEmitter<any> = new EventEmitter();
    @Output('long-press-up') onPressUp: EventEmitter<any> = new EventEmitter();

    constructor(el: ElementRef) {
        this.el = el.nativeElement;
    }

    ngOnInit() {
        this.pressGesture = new Gesture(this.el);
        this.pressGesture.listen();
        this.pressGesture.on('press', (event) => {
            this.onPressRelease.emit('released');
        });
        this.pressGesture.on('pressup', (event) => {
            this.onPressUp.emit(event);
        });
    }

    ngOnDestroy() {
        this.pressGesture.destroy();
    }
}

That is the current directive - any advice is greatly appreciated.