如何在 aAG 网格(ag-grid)中有条件地拖动一行?
How to make a row conditionally draggable in aAG Grid (ag-grid)?
将 AG Grid 与 Angular 结合使用,想知道如何使行有条件地可拖动。例如,如果我们只想使选定的网格行可拖动,应该如何实现。
StackBlitz 示例是 here。
请指教
根据文档:https://www.ag-grid.com/javascript-grid/row-dragging/#enabling-row-dragging
The rowDragcallback function has the following interface:
// function to enable/disable RowDrag function rowDragFunction(params:
RowDragCallbackParams) => boolean;
// interface for params interface RowDragCallbackParams {
node: RowNode;
data: any;
column: Column;
colDef: ColDef;
context: any;
api: GridApi;
columnApi: ColumnApi; }
因此您应该向 rowDrag
提供回调。要查看是否已选择一行,您可以调用 node.isSelected()
:
rowDrag: params => params.node.isSelected(),
选择一行后,您需要通过在 selectionChanged
事件上调用 api.redrawRows
来刷新 rowDrag 回调:
onSelectionChanged(event) {
this.gridApi.redrawRows();
}
在此处查看此实现:https://stackblitz.com/edit/ag-grid-angular-hello-world-cmda8j?file=src%2Fapp%2Fapp.component.ts
将 AG Grid 与 Angular 结合使用,想知道如何使行有条件地可拖动。例如,如果我们只想使选定的网格行可拖动,应该如何实现。
StackBlitz 示例是 here。
请指教
根据文档:https://www.ag-grid.com/javascript-grid/row-dragging/#enabling-row-dragging
The rowDragcallback function has the following interface:
// function to enable/disable RowDrag function rowDragFunction(params: RowDragCallbackParams) => boolean;
// interface for params interface RowDragCallbackParams { node: RowNode; data: any; column: Column; colDef: ColDef; context: any; api: GridApi; columnApi: ColumnApi; }
因此您应该向 rowDrag
提供回调。要查看是否已选择一行,您可以调用 node.isSelected()
:
rowDrag: params => params.node.isSelected(),
选择一行后,您需要通过在 selectionChanged
事件上调用 api.redrawRows
来刷新 rowDrag 回调:
onSelectionChanged(event) {
this.gridApi.redrawRows();
}
在此处查看此实现:https://stackblitz.com/edit/ag-grid-angular-hello-world-cmda8j?file=src%2Fapp%2Fapp.component.ts