如何在构造函数中加载数据,并在ngAfterViewInit中通过Chartjs进行渲染



这是我的问题。许多在Angular中使用Chartjs的例子只假设数据已经存在,并在ngAfterViewInit中呈现。

然而,我不知道如何满足我的要求:

  • 我需要在构造函数中加载数据
  • 加载数据时,我设置了一个布尔属性,用于显示不确定的mat-spinner
  • 当然,加载数据确实是不确定的,我不知道什么时候加载(可能是promise land(
  • 加载数据时,我需要使用Chartjs API将数据绘制到画布中
  • 如果我在构造函数中这样做,那么我会遇到document.getElementById('canvasId')的空引用,因为它还没有被渲染
  • 如果我在constructor中加载数据,并想在ngAfterViewInit中渲染画布,那么我不知道数据何时加载,因为它是不确定的,并且我遇到了数据对象属性的空引用
  • 如果我在ngAfterViewInit中加载数据,那么Angular会抱怨ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked. Previous value: 'ngIf: undefined'. Current value: 'ngIf: true'。此错误与mat-spinner *ngIf='progress'有关

在如何协调这些需求的问题上,我陷入了困境。有什么帮助吗?

这篇文章使用一个服务来获取数据,并在加载数据后呈现图表。希望它能有所帮助!

来自服务的角载荷数据

我得到的表达式更改错误,但加载和执行在OnInit为我工作

最新更新