我无法调用超出范围的方法

Question

我有一列有一个按钮，当它被点击时会调用一个方法。所以点击给了我行对象，我拉出我需要调用另一个方法的属性。我不能调用 reloadDialog 它在我的组件中。这是在 DxGrid 的列中。

<dxi-column type="buttons" caption="Button"
  [width] = 150 alignment="left"
  [allowExporting]="false">
  <dxi-button
      text="Detail"
      [visible]="true"
      [onClick]="buttonClickDetails">
  </dxi-button>
</dxi-column>

这个buttonClickDetails和reloadDiaload在同一个组件中

public buttonClickDetails(e: any) {
  console.log('inside button click details');
  const id = e.row.data.AgreementId;
  console.log('Leaving the buttonClickDetails');
  // I get an error that says reloadDialog is not a funtion.
  this.reloadDialog(id, 'Agreement');
}

Answer 1

确保您已应用文档提供的所有说明。在他们的示例中，他们向您展示了您需要像这样自己绑定上下文：

@Component(...)
export class MyComponent {

    constructor() {
        // binding 'this' will pass it as the context of that function.
        this.buttonClickDetails = this.buttonClickDetails.bind(this);
    }

    public buttonClickDetails(e: any) {
        console.log('inside button click details');
        const id = e.row.data.AgreementId;
        console.log('Leaving the buttonClickDetails');
        this.reloadDialog(id, 'Agreement');
    }
}

我从哪里得到它的文档：Command Column Customization


我认为他们没有提供“正常”的 Angular 输出事件方法，例如：(click)="buttonClickDetails($event)"，这真的很奇怪。那不需要额外的绑定指令，但我想它就是这样。