title: How to in angular2 make my longpress directive on a button not trigger a click or router event?
body: <p>I have the following longpress directive:</p>
  
  <pre><code>//&lt;div (click)="open(item)" [routerLink]="['./myroute']" [routerLinkActiveOptions]="{exact: true}" long-press (longpress)="select(item)"&gt;&lt;/div&gt;
  
  import {Directive, HostListener, Output, EventEmitter} from '@angular/core';
  
  @Directive({
    selector: '[long-press]'
  })
  export class LongPressDirective {
    private touchTimeout: any;
    @Output() longpress = new EventEmitter();
  
    private rootPage: any;
  
    constructor() {}
  
    @HostListener('touchstart') touchstart():void {
      this.touchTimeout = setTimeout(() =&gt; {
          this.longpress.emit({});
      }, 400);
    }
  
    @HostListener('touchend') touchend():void {
        this.touchEnd();
    }
    @HostListener('touchcancel') touchcancel():void {
        this.touchEnd();
    }
  
    private touchEnd():void {
      clearTimeout(this.touchTimeout);
    }
  </code></pre>
  
  <p>Problem is, when I do a longpress, I trigger both the function in (longpress) and (click). How can I make it so that I only trigger the "select(item)" method, and not the "open(item)" or navigate to another route if I do a longpress?</p>