Angular Ionic中的Highchart事件单击运行时错误
我是《爱奥尼亚》杂志的新手,为graph集成了Highchart sdk。但我无法单击highchart事件 我的typescript文件是:Angular Ionic中的Highchart事件单击运行时错误,angular,typescript,highcharts,ionic3,Angular,Typescript,Highcharts,Ionic3,我是《爱奥尼亚》杂志的新手,为graph集成了Highchart sdk。但我无法单击highchart事件 我的typescript文件是: import * as HighCharts from 'highcharts'; HighCharts.chart('hzdTypeTrend', { chart: { margin: [30, 0, 85, 30], spacingTop: 0, spacingBottom: 0,
import * as HighCharts from 'highcharts';
HighCharts.chart('hzdTypeTrend', {
chart: {
margin: [30, 0, 85, 30],
spacingTop: 0,
spacingBottom: 0,
spacingLeft: 0,
spacingRight: 0,
type: 'line'
},
title: {
text: 'Type of Hazard Trend'
},
legend: {
layout: 'horizontal',
//align: 'right',
x: 0,
verticalAlign: 'buttom',
y: 90,
floating: true,
backgroundColor: '#FFFFFF'
},
credits: {
enabled: false
},
xAxis: {
categories: [this.beforeMonth, this.previousMonth, this.currentMonth]
},
plotOptions: {
line: {
dataLabels: {
enabled: true
},
}
},
colors: [
'#5B9BD5',
'#5CB85C',
'#A5A5A5',
'#CCA300',
],
series: [{
name: 'Physical',
data: this.haztypetrend.physical,
cursor: 'pointer',
point: {
events: {
click: function () {
var month = this.category;
this.filterHzdlisting('hzrdtrend', month, 66);
}
}
}
},{
name: 'Human Factor',
data: this.haztypetrend.humanfactor,
cursor: 'pointer',
point: {
events: {
click: function () {
}
}
}
}]
});
public filterHzdlisting(obsGraphType: string, mnth: any, statusId_: string) {
this.showChartView = false;
this.showListView = true;
console.log("statusId====== " + statusId_);
}
当我单击highchart series events click函数时,我得到以下运行时错误
ERROR
TypeError: this.filterHzdlisting is not a function. (In 'this.filterHzdlisting('hzrdtrend', month, 66)', 'this.filterHzdlisting' is undefined)
click — main.js:6539
(anonymous function) — vendor.js:57714:449
forEach
each — vendor.js:57712
fireEvent — vendor.js:57714:250
firePointEvent — vendor.js:57971:495
onContainerClick — vendor.js:57898:237
onclick — vendor.js:57899
H — polyfills.js:3:23956
onInvokeTask — vendor.js:5114
runTask — polyfills.js:3:10845
invokeTask — polyfills.js:3:16802
p — polyfills.js:2:27655
v — polyfills.js:2:27895
如果我将函数绑定到click()中,那么它可以工作,但无法获得确切的月份。月份值显示为未定义。该问题与Highcharts回调函数有关。在
内部,单击回调,该回调指向图表系列,而不是组件对象
尝试以下解决方案:
point: {
events: {
click: (function(self) {
return function() {
// this as Highcharts series
var month = this.category;
// self - reference to the component object
self.filterHzdlisting('hzrdtrend', month, 66);
}
})(this)
}
}
谢谢你的完美逻辑…很好,伙计