拖放不适用于ag栅格角度



我在枢轴模式下使用ag栅格角度。我面临的问题是无法在行、值和列区域中拖放列。我可以从ts文件在这些区域添加列,但不能通过拖放从UI添加列。我可以从这些区域中删除任何列,但不能添加和列。这是ag代码。

<ag-grid-angular #agGrid
style="width: 90%; height: 500px; margin-top: 30px;"
id="myGrid"
[rowData]="rowData"
class="ag-theme-balham"
[columnDefs]="columnDefs"
[enableColResize]="true"
[enableSorting]="true"
[sideBar]="sideBar"
[defaultColDef]="defaultColDef"
[pivotMode]="true"
[statusBar]="statusBar"
[enableRangeSelection]="true"
enableRowGroup="true"
dragAndDrop =" true"
[animateRows]="true"
(gridReady)="onGridReady($event)"></ag-grid-angular>

任何人都可以告诉我我在这里缺了什么。

类似问题类似Plunker:https://plnkr.co/edit/xtPbAztpG14bleAF9bgy?p=preview

在ag网格模式下,您不能拖放行。但是,您可以通过在mouseover(mouseover(上动态添加draggable=true来使行可拖动,通过dom获取单元格id并使其可拖动。

A simple code would be
// This method is used to handle the drag row functionality in ag-grid. It adds the draggable event to rows in grid.
this.gridOptions.onCellMouseOver = (dragEvent: any) => {
if (dragEvent.event.target && dragEvent.event.target.offsetParent.classList.contains('ag-row')) {
dragEvent.event.target.offsetParent.setAttribute("pdraggable", "data");
dragEvent.event.target.offsetParent.setAttribute("draggable", "true");
//dragStart event needs to be added as firefox is not reading draggable=true without this.
//https://salesforce.stackexchange.com/questions/214613/draggable-true-is-not-working-in-firefox-for-lightning-component
dragEvent.event.target.offsetParent.addEventListener('dragstart', (event: any) => {
event.dataTransfer.setData('data', 'data');
}, true);
this.draggedRow = dragEvent.data;
}
this.draggedRow = dragEvent.data;
};
}

这个答案适用于所有面临相同问题的人。。。Ag网格内置提供了此功能请参阅以下内容。。。

https://www.ag-grid.com/javascript-grid-side-bar/

最新更新