具有页面以动态方式将数组的输出呈现为Angular中的负载

Question

我正在创建一些图表，但出现错误提示：

ERROR TypeError: "this.datasets[0] is undefined"

页面被调用的原因是我的变量，但是它仍在用数据初始化。

 dailyStatistics() {
        this.reportingService.dailyStats(this.toDate, this.fromDate).subscribe( r => {
                this.dailyStats = r;
        },
       error => {
            console.log('Failed to get Stats' + error);
        },
        () => {
            console.log('Done getting daily stats.');
            console.log(this.dailyStats.length);
            for (const value of this.dailyStats) {
                console.log('average' + value.average);
                this.tempAverages.push(value.average);
            }
        });
    }

我像这样使用tempAverages：

<div style="display: block;">
    <canvas baseChart width="400" height="400"
            [datasets]="tempAverages"  //issue is here
            [labels]="lineChartLabels"
            [options]="lineChartOptions"
            [colors]="lineChartColors"
            [legend]="lineChartLegend"
            [chartType]="lineChartType">
    </canvas>
</div>

问题在tempAverages初始化时，如何仍然显示图表？

Answer 1

我会尝试使用async (...) await (...)，那样您应该能够强制tempAverages加载，因为它被称为。

文档参考：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/async_function