在 Angular 中使用 Chart.js 渐变插件并输入 Chartjs 选项？

Question

这个纯 Typescript 配置一个使用渐变插件的类型化 Chart.js 对象实例，并且 Typescript 不会产生任何 linting 错误。

https://stackblitz.com/edit/typescript-9xhkzc?file=index.ts

但是如果我们在 Angular 中尝试同样的事情：

https://stackblitz.com/edit/stackblitz-starters-7nd716?file=src%2Fmain.ts

Typescript 会产生这样的 linting 错误：

Object literal may only specify known properties, and 'gradient' does not exist in type 'ChartDataset<keyof ChartTypeRegistry, (number | [number, number] | Point | BubbleDataPoint | null)[]>'.

我们如何在 Angular 的类型化 Chart.js 配置实例中使用渐变插件？

Answer 1

在项目中，您提供的作品有一个依赖项“chartjs-plugin-gradient”：“^0.6.1”，有些东西告诉我情况确实如此。因为在 Angular 项目中它没有安装。

安装后你可以这样称呼：

import gradient from 'chartjs-plugin-gradient';

Chart.register(gradient);

请看叉子：

https://stackblitz-starters-pb3dse.stackblitz.io