错误 TS2322：类型 'string' 不可分配给类型 'keyof ChartTypeRegistry'

Question

home.component.ts

global: boolean = false;
country!: string;
data: GlobalData;
dailyData: any[] = [];
countries: any[] = [];
lineChartData: any[] = [
  {
    data: [65, 64, 33, 44],
    label: 'Temp label'
  }
];
lineChartType = "line";
lineChartLabels: any[] = [
  'label01', 'label02', 'label03'
];
barChartData: any[] = [
  {
      data: [65, 76, 33],
      label: 'Label'
  }
];

home.component.html

<canvas baseChart
    [chartType] = "lineChartType"
    [datasets] = "lineChartData"
    [labels] = "lineChartLabels"
>
</canvas>

错误：

Type 'string' is not assignable to type 'keyof ChartTypeRegistry'

错误行：

[chartType] = "lineChartType"

错误发生在home.component.html

我需要一个解决方案。尝试在 google 上找到解决方案，但我找不到。

Answer 1

仅供参考，ChartTypeRegistry 由 chart.js 在 version 3.0 and later 中引入。

因此，我断定您安装的 chart.js 与最新的 ng2-chart（版本 2.4.2）不兼容。

为了重现同样的问题，我安装了 chart.js 版本 3.4 作为下面的 link：

Sample project (chart.js v 3.4)

---

解决方案（chart.js3.0之前的版本）

根据ng2-charts - npm，

您需要安装 chart.js：

npm install chart.js@2.9.4

或

npm install @types/chart.js@2.9.33

Sample solution (chart.js v 2.9.4)

---

解决方案（chart.js 3.0 版及更高版本）

将 lineChartType 指定为 ChartType 类型。

import { ChartType } from 'chart.js';

public lineChartType: ChartType = "line";

Sample solution (chart.js v 3.0)