如何在Typescript的回调中访问类变量/方法？

问题描述

我在我的 angular 项目中使用了高图表 API，所以我需要的是当我深入到任何地图位置时，我已经获得了我传递到我的类级方法中的状态代码来在其中做一些服务.

这是我当前的代码：

ngOnInit() {

this.chartOptions = {
  chart: {
    height: (8 / 16) * 100 + '%',events: {
      drilldown(e) {
        // ERROR Error: this.getvendorProductStatsByStateCode is not a function
        this.getvendorProductStatsByStateCode(e.point.drilldown);
        const chart = this as any;

        const mapKey = 'countries/ca/' + e.point.drilldown + '-all';
        const mapData = require(`@highcharts/map-collection/countries/ca/ca-on-all.geo.json`);
        const provinceData = Highcharts.geojson(mapData);
        provinceData.forEach((el: any,i) => {
          el.value = i;
        });

        chart.addSeriesAsDrilldown(e.point,{
          name: e.point.name,data: provinceData,dataLabels: {
            enabled: true
          }
        });

        chart.setTitle(null,{ text: e.point.name });
      },drillup() {
        const chart = this as any;
      }
    }
  },title: {
    text: ''
  },colorAxis: {
    min: 0,minColor: '#E6E7E8',maxColor: '#417BCC'
  },mapNavigation: {
    enabled: true,buttonoptions: {
      verticalAlign: 'bottom'
    }
  },plotOptions: {
    map: {
      states: {
        hover: {
          color: '#F8BA03'
        }
      }
    }
  },series: [
    {
      name: 'Canada',data: caMap
    }
  ],drilldown: {}
};
}

getvendorProductStatsByStateCode(mapstateCode) {
    console.log(mapstateCode);
}

这是stackblitz running example

在调用向下钻取函数时，我想访问 this.getvendorProductStatsByStateCode，它位于我的类组件方法中。实现它的正确方法是什么？

解决方法

你可以在一个变量中定义你的组件并使用这个变量而不是 (this) 因为它是方法的实例而不是像那样的组件：

  caMap.forEach((el: any,i) => {
      el.value = i;
      el.drilldown = el.properties['hc-key'];
    });
    var myComp = this;
    this.chartOptions = {
      chart: {
        height: (8 / 16) * 100 + '%',events: {
          drilldown(e) {
            // ERROR Error: this.getVendorProductStatsByStateCode is not a function
            myComp.getVendorProductStatsByStateCode(e.point.drilldown);
            const chart = this as any;

            const mapKey = 'countries/ca/' + e.point.drilldown + '-all';
            //Stackbliz wont load data if you pass mapkey as variable. So I use a hard code one in this example.
            // const mapData = require(`@highcharts/map-collection/${mapKey}.geo.json`);
            const mapData = require(`@highcharts/map-collection/countries/ca/ca-on-all.geo.json`);
            const provinceData = Highcharts.geojson(mapData);
            // Set a random value on map
            provinceData.forEach((el: any,i) => {
              el.value = i;
            });