Angular: Key Events von Canvas empfangen. Wie?

[7-it]

Ich habe eine Komponente:

@Component({
  selector: 'app-canvas',
  template: `<canvas #canvas width="600" height="300"></canvas>`,
  styles: ['./canvas.component.css']
})
export class CanvasComponent implements OnInit {

  @ViewChild('canvas', { static: true })
  canvas: ElementRef<HTMLCanvasElement>;            
  private ctx: CanvasRenderingContext2D;             
  private mouseCords : Point;                       
  private mouseDown : boolean = false;        

  constructor() { }

  ngOnInit() {
    this.ctx = this.canvas.nativeElement.getContext('2d');
    this.canvas.nativeElement.focus();             

    this.draw();
  }

  @HostListener('mouseup', ['$event'])
  onMouseup() {
    this.mouseDown = false;
    console.log(event);
  }

  @HostListener('mousemove', ['$event'])
  onMousemove(event: MouseEvent) {
     this.mouseCords = new Point( event.clientX, event.clientY );

     console.log(event);    
  }

  @HostListener('mousedown', ['$event'])
  onMousedown(event) {
    console.log(event);    
  }

  @HostListener('keydown', ['$event'])
  onKeyDown(event) {
    console.log(event);    
  }

  draw(): void {
  }
}

Wie kann ich Key-Events (KeyDown, KeyPress, KeyUp) von Canvas erhalten?

in der ngInit funktion erhält die Canvas den Fokus, allerdings, so wie ich mir es gedacht hatte mit dem Empfang von Key-Events klappt nicht.

[hellbringer]

Das Canvas-Element hat keine Key-Events. Du müsstest wohl auf die Events vom window-Element hören.