ag-grid angular更新表格数据的方法

数据更新有三种情况:

1.表格整个数据的更新:setRowData
2.更新一行数据:setData 、updateRowData、applyTransaction
3.更新单元格数据:setDataValue

1.表格整个数据的更新

 //调用接口重新设置数据
  this.gridApi.setRowData(newData);

2.更新一行数据

function bySetRows() {
   //通过setData更新,首先获取需要更新的节点
   var rowNode = this.gridApi.getRowNode(2);//获取表格第3行数据
   //更新的数据
   var newData = {
      id: 'bb',
      make: 'Ford',
      model: newModel,
      price: newPrice,
    };
    rowNode.setData(newData);
 }
function byRowNode() {
 	var selRow = this.gridApi.api.getSelectedRows(0); //获取选中的行    
 	selRow.name = '小明'; //更新选中数据的第一行            
 	this.gridApi.api.updateRowData({update: selRow});
}

let rowNodeTrans = this.gridOptions.api?.applyTransaction({ add: [data] });
this.gridOptions.api?.flashCells({ rowNodes: rowNodeTrans?.add })

// 还有remove 和 update 方法
 const index = this.rowData.findIndex(item => item.fxDataId === id);
 this.rowData[index] = { ...this.rowData[index],'name':'Jack'}
 this.gridOptions.api?.applyTransaction({
  update: [this.rowData[index]]
 });
 

3.更新单元格数据

 //获取具有给定 ID 的行节点
 var rowNode = this.gridApi.getRowNode('id');
 var newName = '小明';
 // 替换指定列的值
 rowNode.setDataValue('name', newName);

页面有多个表格时最好用applyTransaction

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值