Highcharts -类型Point Angular 12中不存在属性值

Question

在Angular中扩展Highcharts时，我得到的错误属性值不存在于类型点Angular 12的传奇参数下。除了所有其他的事情都是工作，请让我知道我可以在哪里放置这个值，以便能够在传奇中获得结果。

当我检查这个时，在下面的代码中labelFormatter。选项，它返回{"name":"Account value"; "value":500; "y":500}，但是这个。值给出错误。

chartOptions: Highcharts.Options = {
colors: ['#276ab4', '#44b749'],
exporting: {
enabled: false
},
title: {
text: 'Account overview',
align: 'left',
style: {
fontFamily: 'Roboto,sans-serif',
}
},
legend: {
enabled: true,
layout: 'vertical',
align: 'center',
verticalAlign: 'top',
borderWidth: 0,
margin: 0,
padding: 0,
labelFormatter: function () {
// return '<b>' + this.name + ' : ' + '</b> ₹' + JSON.stringify(this.options) + '';
return '<b>' + this.name + ' : ' + this.value + '';
},
itemMarginTop: 10,
itemMarginBottom: 10,
itemStyle: {
fontFamily: 'Roboto,sans-serif',
fontSize: '12px'
},
width: "100%"
},
tooltip: {
headerFormat: '',
pointFormat: '<b>{point.name} : </b>₹{point.value}',
backgroundColor: '#eee',
borderColor: '#dbdbdb',
borderRadius: 3,
borderWidth: 1,
shadow: false,
style: {
color: '#000',
padding: '10px',
fontFamily: 'Roboto,sans-serif',
fontSize: '12px'
}
},
plotOptions: {
pie: {
allowPointSelect: true,
cursor: 'pointer',
dataLabels: {
enabled: false
},
showInLegend: true
}
},
series: [{
data: [
{
name: 'Account value',
value: 500,
y: 500
},
{
name: 'Cash balance',
value: 200,
y: 200
}
],
type: 'pie',
size: '65%',
innerSize: '65%',
showInLegend:true
}],
credits: {
enabled: false
}
}

Answer 1

在缺少TS定义的情况下，您基本上有两个选择:

1. 转换为as any-我不建议这样做。

2. 用缺失的属性扩展现有的接口-推荐

interface CustomPoint extends Highcharts.Point {
value: number;
}

演示:https://stackblitz.com/edit/highcharts-angular-basic-line-lxbwzx
文档:https://github.com/highcharts/highcharts-angular help-and-faq