I am attempting to use some code I found on https://github.com/bevacqua/dragula/issues/289#issuecomment-277143172 to my Ionic project.
When I run the code I get an error Cannot find namespace 'NodeJS'
and the error refers to touchTimeout: NodeJS.Timer;
How can I adapt the code below to make the NodeJS.Timer
line work?
import { Directive, ElementRef, HostListener } from '@angular/core';
@Directive({ selector: '[delayDragLift]' })
export class DelayDragLiftDirective {
dragDelay: number = 200; // milliseconds
draggable: boolean = false;
touchTimeout: NodeJS.Timer;
@HostListener('touchmove', ['$event'])
// @HostListener('mousemove', ['$event'])
onMove(e: Event) {
if (!this.draggable) {
e.stopPropagation();
clearTimeout(this.touchTimeout);
}
}
@HostListener('touchstart', ['$event'])
// @HostListener('mousedown', ['$event'])
onDown(e: Event) {
this.touchTimeout = setTimeout(() => {
this.draggable = true;
}, this.dragDelay);
}
@HostListener('touchend', ['$event'])
// @HostListener('mouseup', ['$event'])
onUp(e: Event) {
clearTimeout(this.touchTimeout);
this.draggable = false;
}
constructor(private el: ElementRef) {
}
}
A quick way to solve this problem is here.
Basically change setTimeout
and clearInterval
to window.setTimeout
and window.clearInterval
, respectively. For example, your onDown
becomes:
onDown(e: Event) {
this.touchTimeout = window.setTimeout(() => {
this.draggable = true;
}, this.dragDelay);
}
Then, your declaration becomes:
this.touchTimeout: number | undefined;