我想找出在 Ag-Grid 中编辑了哪一行？

Question

我想知道在 Ag-Grid 中编辑了哪一行？我只想保存那些被编辑的行？那么有什么方法可以让我找出编辑了哪一行？

Answer 1

您可以为 ag-grid 使用 onCellEditingStopped() 事件。

html

<ag-grid-angular
    ...
    (cellEditingStopped)="onCellEditingStopped($event)"
    ...
    ></ag-grid-angular>

ts

onCellEditingStopped(e) {
    console.log(e.rowIndex);
}

Answer 2

global save button ? not related with a node (row)

yes. correct

好的，在这种情况下，您需要通过 Id 作为示例跟踪哪些数据是新的。因此，假设在您的数据上您有 unique 标识符 - 它将代表 Primary 键或类似的东西 - 这个键应该在后端或数据库端处理。

现在，要仅获取 'new' 个节点，您可以像这样过滤 grid-data：

   let newData = [];
   this.gridApi.forEachNode(node=>{
       if(!node.data.id)
           newData.push(node.data)
   })

但我建议避免多个 insert 并像这样分别处理每个创建：

handleInsert():void{
    let yourDataModel = {
        ...
    }
    this.sampleApiService.sampleRequest(dataModel).subscribe(result => {
        this.gridApi.updateRowData({add:[result], addIndex:0});
    })
}

result - 应该 return 修改 dataModel 为已经定义的 Id

在这种情况下，您将能够更新 grid-data 并确保数据正确并且已插入到您的 storage。

Update added example for update

您还可以使用 valueSetter 来跟踪单元格更新，而不是 (cellEditingStopped) 事件

handleUpdateValue(params: ValueSetterParams){
    // see if values are different if you have a complex object,
    // it would be more complicated to do this.
    if (params.oldValue!==params.newValue) {
        // params.colDef.field - updated cell ID
        ... handle update logic here - call API and so on ...
        // get grid to refresh the cell
        return true;
    } else {
        // no change, so no refresh needed
        return false;
    }
}

我想找出在 Ag-Grid 中编辑了哪一行？

I want to find out which row has edited In Ag-Grid?

ag-grid

ag-grid-react

ag-grid-ng2

angular

html

ts