ag-grid colDef 在事件之间似乎不一致
ag-grid colDef appears inconsistent between events
根据 documentation ag-grid 列定义可用于更新单元格 css class。 colDef 对象在列事件中可用,即 newValueHandler 和 cellValueChanged。我正在尝试将其用于 add/remove css classes。
它在 newValueHandler 中有效,但在 onCellValueChanged 中无效。我可以看到这两个事件 args 都公开了一个 colDef 对象,但以下内容仅在 newValueHandler 中有效:
dropdownValueUpdateHandler(p, key) {
this.svc.updateProductField(p.data.ID, p.colDef.field, p.newValue.code)
.catch(err => {
p.colDef.cellClass = 'ag-etp-cell-failed'; // <---- updating cell to show error
最后一行在第一个事件中有效,但在单元格值更改事件中它什么都不做。
更新:尝试使用动态函数,但它也无法正常工作(或者我做错了)
getCellClass(p){
console.debug('getCellClass ', p);
return p.data.Status == 'saved'
? 'ag-etp-cell-saved'
: p.data.Status == 'failed'
? 'ag-etp-cell-failed'
: '';
}
在我的 valueUpdatedHanler 中成功:
e.data.Status = 'saved';
e.api.refreshCells([ e.node] , [e.colDef.field]); // this has a weird lag, doesn't refresh correct, doesn't seem to call getCellClass function
e.api.refreshView(); // this works but refreshes the whole grid which can be costly
更新有点工作,但后续事件似乎滞后,即如果前一个事件失败,下一个成功仍然以失败的形式返回
如果我刷新整个网格,就可以了。但我希望避免这样做,因为它是一个大网格..
更新列定义时,您必须告诉 ag-grid 刷新以获取更改。您可以通过调用 gridAPI.refreshView()
刷新整个网格或 gridAPI.refreshCells(rowNodes, colIds)
仅刷新该单元格来实现。
CellClass 只会将 类 添加到单元格,而不会删除之前添加的单元格。
您可能希望使用 cellClassRules 来处理更复杂的规则
cellClassRules : {
'ag-etp-cell-failed': function(params) { return params.data.Status === 'failed' },
//etc
},
根据 documentation ag-grid 列定义可用于更新单元格 css class。 colDef 对象在列事件中可用,即 newValueHandler 和 cellValueChanged。我正在尝试将其用于 add/remove css classes。
它在 newValueHandler 中有效,但在 onCellValueChanged 中无效。我可以看到这两个事件 args 都公开了一个 colDef 对象,但以下内容仅在 newValueHandler 中有效:
dropdownValueUpdateHandler(p, key) {
this.svc.updateProductField(p.data.ID, p.colDef.field, p.newValue.code)
.catch(err => {
p.colDef.cellClass = 'ag-etp-cell-failed'; // <---- updating cell to show error
最后一行在第一个事件中有效,但在单元格值更改事件中它什么都不做。
更新:尝试使用动态函数,但它也无法正常工作(或者我做错了)
getCellClass(p){
console.debug('getCellClass ', p);
return p.data.Status == 'saved'
? 'ag-etp-cell-saved'
: p.data.Status == 'failed'
? 'ag-etp-cell-failed'
: '';
}
在我的 valueUpdatedHanler 中成功:
e.data.Status = 'saved';
e.api.refreshCells([ e.node] , [e.colDef.field]); // this has a weird lag, doesn't refresh correct, doesn't seem to call getCellClass function
e.api.refreshView(); // this works but refreshes the whole grid which can be costly
更新有点工作,但后续事件似乎滞后,即如果前一个事件失败,下一个成功仍然以失败的形式返回
如果我刷新整个网格,就可以了。但我希望避免这样做,因为它是一个大网格..
更新列定义时,您必须告诉 ag-grid 刷新以获取更改。您可以通过调用 gridAPI.refreshView()
刷新整个网格或 gridAPI.refreshCells(rowNodes, colIds)
仅刷新该单元格来实现。
CellClass 只会将 类 添加到单元格,而不会删除之前添加的单元格。
您可能希望使用 cellClassRules 来处理更复杂的规则
cellClassRules : {
'ag-etp-cell-failed': function(params) { return params.data.Status === 'failed' },
//etc
},