[Ionic 4] Event preventDefault on ion-button click not working

Ionic Framework
1

Hello.

I’m using Ionic 4 and I made a directive to prevent clicks on components if some condition applies.

 @Directive({
      selector: '[appDisable]'
  })
  export class DisableDirective {
      
      @Input() ifTruthy: boolean = false;

      @HostListener('click', ['$event']) clickEvent(event: Event): boolean {
	  if (this.ifTruthy) {
	      console.log('Preventing click');
	      console.log('This should prevent further clicks from happening?');
	      event.preventDefault();
	      event.stopPropagation();
	      return false;
	  }

	  return true;
      }

      constructor(
	  private element: ElementRef,
	  protected renderer: Renderer2) {
      }

  }

Then on my button:

<ion-button appDisable [ifTruthy]=“1 === 1” (click)=“presentAlert()”>Disabled</ion-button>

This does not work, it works if I move the click() to an upper element (due to the stopPropagation), I want to know why this does not work.

I made a stackBlitzz

Any help is appreciated.