在 ag-grid 中编辑单元格值后如何启动方法?

Ahm*_*rib 5 ag-grid ag-grid-react ag-grid-ng2 angular ag-grid-angular

我有这个简单的专栏:
在此处输入图片说明

这是它的定义:

{
      headerName: "Activité",
      field: "activite",
      editable: true,
       , cellClass: "cell-wrap-text"
      }  
Run Code Online (Sandbox Code Playgroud)

这是每次用户在该列中输入新输入时我想启动的方法。

  public UpdateActValue() {
      this.data.sendActToBia(this.params.data.activite);
      }  
Run Code Online (Sandbox Code Playgroud)

以下是我的问题:
1/ 在编辑列中的单元格值后,是否有任何 ag-grid“本机”方式来启动特定方法?
2/ 我应该简单地定义一个自定义单元格渲染器并在那里完成所有必要的工作吗?
谢谢!

wen*_*jun 7

您可以利用cellValueChanged事件绑定来检测单元格值的变化。

在您的 component.html 上,您可以简单地将onCellValueChanged()方法绑定到cellValueChanged事件。

<ag-grid-angular 
.
.
(gridReady)="onGridReady($event)"
(cellValueChanged)="onCellValueChanged($event)"
>
Run Code Online (Sandbox Code Playgroud)

在您的 component.ts 上,您将定义该onCellValueChanged()方法,该方法将在每次任何单元格值更改时触发。

onCellValueChanged(event) {
  // handle the rest here
}
Run Code Online (Sandbox Code Playgroud)

您可以在此处阅读有关网格单元编辑和更改检测的更多信息。


Ahm*_*rib 5

我刚刚找到了一种简单的方法来做到这一点。我希望它有帮助。

在 grid.component.html 中:

在网格定义中添加以下内容:

  (cellValueChanged)="onCellValueChanged($event)"
Run Code Online (Sandbox Code Playgroud)

在grid.component.ts中:定义方法:

onCellValueChanged(params) {
    const colId = params.column.getId();
    if (colId === "activite") {
      this.data.sendActToBia(params.data.activite);
}
  }
Run Code Online (Sandbox Code Playgroud)