Angular ionic single tap and double tap

user_11820495 0
Viewed 364

Hi I created a directive with the goal of intercepting single tap and double tap with HammerJs but it doesn't work the way I want it to and now I'm running out of ideas on how to solve the problem.

I tried this:

  @HostListener('tap', ['$event'])
   handleTaps(event) {
     if(event.tapCount == 2) {
      this.doubleTap.emit();
      event.prevenDefault();
     } else {
       this.singleTap.emit();
       event.prevenDefault();
    }
   }

The problem is that it does call Double Tap or double click but also the single tap before. What would be the solution to prevent this ? Use a set timeout ? Thanks

ionic-framework angular typescript double javascript
1 Answers

Basing on your code, try this

firstClicked = false;    
@HostListener('tap', ['$event'])
handleTaps(event) {
  if(!this.firstClicked){
       this.firstClicked = true;
       this.singleTap.emit();
       setTimeout(()=> {
          this.firstClicked = false;
       }, 200);
   }else{
       this.doubleTap.emit();
   }
}

here is an Angular example that i made with it but with "click" event. To be honest i'm not sure if setTimeout will work with IONIC, instead you can use native Timer API with the same previous concept i guess.

user_86789000
Related