时间戳

首页 > 解决方案 > Chart.js 错误：类型缺少调用签名 '((...items: number[]) => number) | ((...items: ChartPoint[]) => number)' 在 Angular

angular - Chart.js 错误：类型缺少调用签名 '((...items: number[]) => number) | ((...items: ChartPoint[]) => number)' 在 Angular

问题描述

将 Angular 应用程序部署到Heroku时，出现错误

错误 TS2349：无法调用其类型缺少调用签名的表达式。输入 '((...items: number[]) => number) | ((...items: ChartPoint[]) => number)' 没有兼容的调用签名。

但是我在这个组件中没有显示错误的这种类型的代码。所以这似乎是 chart.js 类型缺少问题或@types/chart.js版本不匹配。

正在使用以下版本

"chart.js": "^2.8.0",
"@types/chart.js": "^2.7.52"

更新

<div style="display: block;">
    <canvas #myChart baseChart 
            [datasets]="lineChartData" 
            [labels]="lineChartLabels" 
            [options]="lineChartOptions"
            [colors]="lineChartColors" 
            [legend]="lineChartLegend" 
            [chartType]="lineChartType"
          (chartClick)="onChartClick($event)">
    </canvas>
</div>

在 .ts 文件中

this.lineChartData[0].data = [0]
this.lineChartData[0].data = [1]
this.lineChartData[0].data = [2]

标签： angularchart.jsangular7chart.js2

解决方案

其实[datasets]="lineChartData"有两种。一种是number[]，另一种是ChartPoint[]将数据存储为数字，我们需要将数据类型转换为

(this.lineChartData[0].data as number[]).push(1)

HTML

<div style="display: block;">
    <canvas #myChart baseChart [datasets]="lineChartData"></canvas>
</div>

推荐阅读