Angular 5 with Canvas drawImage not showing up

@Kaiido is correct. I need to wait for the image to load. I'm using setTimeout(e => this.draw(), 500); until I figure out a better solution.

try by using the following code:

Component HTML

<img #pdf style="display: none;" src="assets/pdf.png" />
<canvas #canvas></canvas>

Component.ts

 @ViewChild('canvas') public canvas: ElementRef;
 //Assets
 @ViewChild('pdf') imageObj: ElementRef;
 canvasEl: any;
 ctx: CanvasRenderingContext2D;
 ...
 draw() {
    ... 
    this.ctx.drawImage(imageObj.nativeElement, width, height);     
 }
 ...

Finaly all your code is ok. Just implement the loading image by using Element Ref.