import { Directive , HostListener , ElementRef } from '@angular/core' ; @ Directive ( { selector : `[keyHandler]` , } ) export class KeyHandlerDirective { constructor ( private element ) { } @ HostListener ( 'keyup' , [ '$event' ] ) keyEvent ( event ) { if ( event . key === ' ' || event . key === 'Enter' || event . key === 'Spacebar' ) { event . preventDefault ( ) ; const hostElement = < HTMLElement > this . element . nativeElement ; hostElement . click ( ) ; } } }