从Chart.js选项回调中调用TypeScript函数

Question

我正在使用Chart.js的包装器，该包装器允许动画回调来确定何时绘制图表。

因此，我的图表选项如下所示：

public chartOptions: any = {
    animation: {
        duration: 2000,
        onComplete: function () {
            //alert('anim complete');
            this.chartTestMethod();
        }
    },
    responsive: true
};

我的chartTestMethod()样子是这样的：

chartTestMethod() {
     console.log('chartTestMethod called.');
}

我希望chartTestMethod()在图表动画完成时调用该方法（在同一TypeScript文件中）。但是，当动画完成并且执行了该方法调用行时，出现错误：

TypeError: this.chartTestMethod is not a function. 

基本上，如何正确调用该方法？

Answer 1

我暗示你chartTestMethod是同一类chartOptions因为你使用它在此。你应该确保你了解这是在JavaScript处理方式（打字稿是JavaScript的一个超集）。那里必须有一百万个引用。

在不了解Chart.js的情况下，我认为可以安全地假定，在调用onComplete时，此上下文绝不适合您的类实例。因此，您想要的是一个箭头函数，如下所示：

onComplete: () => { this.chartTestMethod(); }

阅读有关TypeScript箭头函数的信息，以了解如何确保它实际上指向您的实例。