While working in angular 13, for "HTMLCanvasElement" and "CanvasRenderingContext2D" I am getting "Object is possibly undefined"

Issue

While working in angular 13, for "HTMLCanvasElement" and "CanvasRenderingContext2D" I am getting

Object is possibly undefined

Code snippet:

canvasEl: HTMLCanvasElement | undefined ;
    
private plot: CanvasRenderingContext2D | undefined;

....
....

//following all lines giving error of "Object is possibly undefined"
this.canvasEl = this.canvas.nativeElement;
this.plot=this.canvasEl.getContext("2d");   
this.canvasEl.width = this.width;
this.canvasEl.height = this.height;

How to resolve these errors? How I can declare variables to solve these errors?

Solution

If you are sure that your element is available and never undefined just add a ! after your variable:

canvasEl!: HTMLCanvasElement 
private plot!: CanvasRenderingContext2D;

Answered By - sickpig