Chartjs-Angular canvas is undefined

by

1👍

✅

Solved

I’ve compiled micronyks answer with other codes and it’s working now.

Here is how I’ve done it:

// Pay attention to added `read: ElementRef` (the most important part is this code
@ViewChild('barCanvas', {static: false, read: ElementRef}) barCanvas: ElementRef;

Then I added AfterViewInit to my component and placed my loading code into that

ngAfterViewInit() {
  setTimeout(() => {
    this.barChartFunction();
  }, 6000);
}

barChartFunction() {
  // my charts code...
}

Hope it comes handy for those in need.

0👍

I don’t understand IONIC but,

I’m sure that ionViewDidEnter function runs before ngAfterviewInit life cycle hook of Angular component.

ViewChild instance get initialized or accessible ONLY in/after ngAfterViewInit life cycle hook.

So, You have to make sure that ionViewDidEnter runs once viewChild instance is accessible or make sure to run barChartFunction function from ngAfterViewInit function.

Leave a comment