angular - 编辑或添加后无法刷新 ag 网格的行 - Angular

Question

当我编辑特定行的某些单元格值或添加新行时，我想刷新表格，它应该实时添加到表格中。

下面是这个过程。

我有一个名为“主要组件”的组件，其中我有一个通过从后端获取数据创建的表。我在过滤器组件中获取数据，并从那里使用 RxJS 的主题传递它。我正在创建如下表：

this.filterData.apiData$.subscribe(data => {
  if (data) {
    this.searchedData = data;
    }
})

createTable()
    this.table
      .columnData(cols[]) - Currently 6 columns
      .rowData(rows[]) - Currently 9 rows
  ...
 

现在，当我想编辑调用的某些值时，我所做的是，我打开一个包含同一张表的对话框，然后在该对话框中编辑值，一旦完成编辑，我将整行传回使用 RxJS 的主题到组件（主组件）。我在我的组件中获得了一组更新的数据，如下所示。

this.dialog.editedDataObserver.subscribe((editedData: any[]) => {
  if (editedData) {
    this.editedDataFromDialog = editedData;
    
    for (let i = 0; i< this.searchedData.length; i++) {
      const updatedObject = this.editedDataFromDialog.find(x => x.id === this.searchedData.id);
      if (updatedObject) {
        this.searchedData[i] = JSON.parse(JSON.stringify(updatedObject));
      }
    }
  }
    }
})

当我检查这些数据时，我可以在我的主要组件中看到，我得到了带有编辑值的正确数据，但是当我将这些值传递给 rowData() 时，我无法在表中看到这些值。

我试图从堆栈溢出以及 ag grid 的文档中执行以下操作。

1. this.gridAPI.setRowData(this.searchedData)
2. this.gridAPI.refreshCells({force: true});

有人可以告诉我我做错了什么吗？如何使用各个单元格中的编辑值刷新表格？

我想显示在将其发送到后端之前编辑的值。

标签： angularag-grid