angular - Ag-Grid 编辑数据并发送到服务器

Question

Angular 上的 Ag-grid 能够创建从本地 json 文件中获取数据的网格。
在编辑任何行时如何保存该数据，然后发送到服务器或可能的本地 json 文件？

简而言之，Ag-Grid 如何在编辑后保存行数据并在单击提交按钮时发送到服务器。
任何人如果在 Javascript 上实现了这个，请发表评论，将尝试在 Angular 上使用它

请让我知道除了 之外是否还有其他最佳选择农业网格 实现这个功能

Answer 1

如果您想监听特定行的特定更改，可以使用 onCellValueChanged , 或 onRowValueChanged在组件模板上定义 ag-grid 组件时的事件绑定(bind)。

 <ag-grid-angular 
.
.
(gridReady)="onGridReady($event)"
(onRowValueChanged) = onRowValueChanged($event)
>

在您的 component.ts 上， onRowValueChanged每次您进行任何更改时都会触发方法

 export class YourComponent {
 private gridApi;
 private gridColumnApi;
   .
   . 
 onRowValueChanged: function(event) {
   console.log(event) // access the entire event object
   console.log(event.data) // access and print the updated row data
   const gridData = this.getAllData();
   // api call to save data

}

getAllData() {
  let rowData = [];
  this.gridApi.forEachNode(node => rowData.push(node.data));
  return rowData;  
}

onGridReady(params) {
  this.gridApi = params.api;
  this.gridColumnApi = params.columnApi;
}