数据透视表.js - 无法访问单击回调中的类变量

Question

我正在尝试访问数据透视表中回调函数内的类变量，我正在使用角度 5和数据透视表：尼古拉克鲁赫滕/数据透视表

我的代码：

declare var jQuery: any;
@Component({
selector: 'app-dialog-commitment-pivot',
templateUrl: '<div id="pivot"></div>',
styleUrls: ['./dialog-commitment-pivot.component.scss']
})
export class DialogCommitmentPivotComponent implements OnInit {
private el: ElementRef;
constructor(
private commitmentService: CommitmentService,
public dialogRef: MatDialogRef<DialogCommitmentPivotComponent>,
@Inject(MAT_DIALOG_DATA) public data: any,
@Inject(ElementRef) el: ElementRef
) {
this.el = el;
}

ngOnInit() {
if (!this.el ||
!this.el.nativeElement ||
!this.el.nativeElement.children) {
console.log('cant build without element');
return;
}
var container = this.el.nativeElement;
var inst = jQuery(container);
var targetElement = inst.find('#pivot');
if (!targetElement) {
console.log('cant find the pivot element');
return;
}
while (targetElement.firstChild) {
targetElement.removeChild(targetElement.firstChild);
}
//render here
targetElement.pivot(this.data.pivotData,
{
rows: ["status"],
cols: ["name"],
rendererOptions: {
table: {
clickCallback: function(e, value, filters, pivotData) {
console.log(e);
console.log(value);
console.log(filters.name);
console.log(pivotData);

this.commitmentService.getPivotDataDetails(filters.name, filters.status)
.subscribe(
res => {
console.log(res);
})
}
}
}
});
}

我收到错误：

类型错误：无法读取未定义的属性"getPivotDataDetails">

我无法从内部访问任何类变量 点击回调 我不确定出了什么问题。

Answer 1

我发现了这个问题。这与数据透视表无关，实际上scope问题。commitmentService在数据透视表回调中不可见。所以我通过执行以下操作来修复它：

1. 移动getPivotDataDetails作为一种DialogCommitmentPivotComponent方法
2. 现在像这样绑定getPivotDataDetails：clickCallback: this.getPivotDataDetails.bind(this)