AG-Grid：updateRowData(update: ItemsArray) 影响所有行而不是选定行

Posted 2023-03-28

【中文标题】AG-Grid：updateRowData(update: ItemsArray) 影响所有行而不是选定行

【英文标题】：AG-Grid: updateRowData(update: ItemsArray) affecting all rows instead of selected rowsAG-Grid：updateRowData(update: ItemsArray) 影响所有行而不是选定行

【发布时间】：2019-09-21 08:49:12

【问题描述】：

我在这个项目中使用 Ag-Grid 和 Angular，我想要做的是设置快捷键以通过按下关联键来更改所选行的“状态”值（'1'='状态完整”等）。有一个名为onCellKeyPress() 的内置函数，它在选择一行或多行后侦听击键。效果很好，我有一个开关盒，它根据按下的键发送一个值，如下所示：

  onCellKeyPress = (e: any) => 
    switch(e.event.key) 
      case '0': this.rowUpdates('New'); break;
      case '1': this.rowUpdates('Completed'); break;
      case '2': this.rowUpdates('Needs Attention'); break;
      case '3': this.rowUpdates('Rejected'); break;
    
  

它向我的自定义函数rowUpdates() 发送一个字符串，该函数获取该值，遍历现有节点，查找任何已选择的节点，为已选择的节点设置值，然后将它们推送到数组中。

现在问题就从这里开始了。 updateRowData 需要 2 个参数，第一个是它正在执行的更新类型（添加、删除、更新），在我的情况下，我使用的是后者，以及要更改的行数组。

  rowUpdates = (value: String) => 
    let itemsToUpdate = [];
    this.gridOptions.api.forEachNode(rowNode => 
      if(rowNode.isSelected() === true) 
        const selected = rowNode.data;
        selected.status.name = value;
        itemsToUpdate.push(selected);
        console.log(itemsToUpdate);
      
    );
    this.gridOptions.api.updateRowData(update: itemsToUpdate);
  

但是，当我按下一个键来更改行值时，它会更新网格中的每一行。更奇怪的是，我有一个方法可以根据“状态”值向行添加一个类，并且只有我打算更改的行接收该类。

我被难住了。我已经 console.logged 这个函数中的所有内容，它们都返回了它们的预期值。该数组始终包含已选择的节点，并且 updateRowData 的返回值始终是同一个数组。我试过用getSelectedNodes 和getSelectedRows 切换'forEachNode' 无济于事。有什么想法吗？

【问题讨论】：

检查您使用的是客户端行模型，因为其他模型（例如服务器端或无限行）不支持事务更新。同时打印调用 updateRowData 返回的数据。这可能会有所帮助。

文档告诉我客户端行模型是默认设置，我没有明确更改它。我尝试按照更新数据功能部分中的示例添加打印功能，但无济于事。不过感谢您的想法！

请注意，文档 (ag-grid.com/javascript-grid-data-update/#updating-rows) 声明“在幕后，网格将调用 rowNode.setRowData(newData)”。但是 setRowData 会更新整个网格。这令人困惑。

【参考方案1】：

请试试这个。

updateItems(value: String) 
    var itemsToUpdate = [];
    this.gridApi.forEachNodeAfterFilterAndSort(function(rowNode, index) 
      if (!rowNode.selected) 
        return;
      
      var data = rowNode.data;
      data.status.name = value;
      itemsToUpdate.push(data);
    );
    var res = this.gridApi.updateRowData( update: itemsToUpdate );
    this.gridApi.deselectAll();//optional
  

【讨论】：

您需要陈述一个与您的代码相关的问题。所以请你能很好地说明你的代码所指的问题吗？

“当我按下一个键来更改行值时，它会更新我网格中的每一行”修复以单独更新选定的行。