angular - 制表符单元格单击 : How to call a function in angular on cell click and use component elements

Question

我正在尝试将 Tabulator 用于 Angular 为 7 的表格。我正在尝试在单击单元格时调用一个函数，以便该函数应该打开一个 MatDialog 框并显示行信息。但是，问题是当我尝试访问被调用函数内的任何组件变量(对话框:MatDialog)时，它是未定义的。在调试时，我发现该函数是在 Tabulator 内部调用的，而不是在 Angular 组件中调用的。有没有办法在 Angular 中调用函数并在函数内部访问组件变量？

export class ExampleTableComponent implements OnInit {
exampleTable: Tabulator;

 constructor(private dialog: MatDialog) { }

ngOnInit() {

    this.exampleTable = new Tabulator("#ex-table-div",{
      height : 300,
      data: this.example_data,
      layout: "fitColumns",
      columns: [
        { formatter:"rownum", align:"center", width:40},
        { formatter: this.printIcon, width:40, align:"center", 
         cellClick: this.openDialog
        },
        .......
      ],
      ......
    });
}


openDialog(e, cell){

    const dialogConfig = new MatDialogConfig();

          dialogConfig.disableClose = true;
          dialogConfig.autoFocus = true;

          this.dialog.open(DetailsComponent, {      
            width: '300px',
          });

     ..........
  }
......
}

Answer 1

我也遇到过这个问题。这是我解决它的方法:

cellClick: (e, row)=> this.openDialog(e, row)