光滑的网格可拖动分组我试图隐藏拖动的字段但是该字段挂在页面上

如何解决光滑的网格可拖动分组我试图隐藏拖动的字段但是该字段挂在页面上

我在下面提到了网格选项。我试图隐藏和显示基于分组字段的列。现场隐藏和显示工作正常。但是拖动的字段固定在屏幕上。

public gridOptions: GridOption = {
        autoCommitEdit: true,enablePagination: true,autoEdit: false,rowHeight: 40,headerRowHeight:40,enableCellNavigation: true,editable: true,enableAutoResize: true,enableSorting: true,enableFiltering: true,enableExcelExport: true,enableExport: true,i18n: this.translateService,gridMenu: {
            hideExportExcelCommand: true,hideExportCsvCommand: true,customItems: [{
                command: "cspfm-excel-export",titleKey: "EXPORT_TO_EXCEL",iconCssClass: "fa fa-file-excel-o",action: (event,callbackArgs) => {
                    this.excelExport(event,callbackArgs)
                }
            },{
                command: "cspfm-csv-export",titleKey: "EXPORT_TO_CSV",iconCssClass: "fa fa-download",{ divider: true,command: '',positionOrder: 90 },{
                command: "cspfm-appm-guide-fetch-mode-fully",titleKey: "Full fetch",iconCssClass: "icon-mat-explore",callbackArgs) => {
                    this.dataFetchMode = 'Full';
                    this.fetchModeChanged()
                },positionOrder: 91
            },{
                command: "cspfm-appm-guide-fetch-mode-batch",titleKey: "Batchwise fetch",iconCssClass: "icon-mat-autorenew",callbackArgs) => {
                    this.dataFetchMode = 'Batch';
                    this.fetchModeChanged()
                },positionOrder: 92
            },{
                command: "cspfm-appm-guide-fetch-mode-action",titleKey: "On click batchwise",iconCssClass: "icon-mat-touch_app",callbackArgs) => {
                    this.dataFetchMode = 'OnClickBatch';
                    this.fetchModeChanged()
                },positionOrder: 93
            },{
                command: "cspfm-toggle-pagination",titleKey: "Toggle pagination",iconCssClass: "fa fa-bookmark",callbackArgs) => {
                    this.togglePagination(event,callbackArgs)
                },positionOrder: 94
            },{
                command: "cspfm-groupby",titleKey: "Group-by",iconCssClass: "icon-mat-account_tree",callbackArgs) => {
                    this.openDraggableGroupingRow()
                },positionOrder: 95
            },{
                command: "cspfm-clear-groupby",titleKey: "Clear Grouping",iconCssClass: "fa fa-times",callbackArgs) => {
                    this.clearGrouping()
                },positionOrder: 96
            }
        ]
        },enableAutoTooltip: true,autoTooltipOptions: {
            enableForCells: true,enableForHeaderCells: true,maxToolTipLength: 1000
        },headerMenu: {
            hideColumnHideCommand: true
        },autoResize: {
            containerId: this.gridContainerId,calculateAvailableSizeBy: 'container'
        },exportOptions: {
            exportWithFormatter: true
        },excelExportOptions: {
            exportWithFormatter: true,},enableTranslate: true,presets: {
            sorters: [{ columnId: this.tableColumnInfo['pfm138993_institutename']['prop'],direction: 'ASC' }],enableAsyncPostRender: true,// for the Angular PostRenderer,don't forget to enable it
        asyncPostRenderDelay: 0,// also make sure to remove any delay to render it
        params: {
            angularUtilService: this.angularUtilService // provide the service to all at once (Editor,Filter,AsyncPostRender)
        },checkboxSelector: {
            // you can toggle these 2 properties to show the "select all" checkbox in different location
            hideInFilterHeaderRow: false,width: 60
        },rowSelectionOptions: {
            // True (Single Selection),False (Multiple Selections)
            selectActiveRow: false,enableCheckboxSelector: true,enableRowSelection: true,enableDraggableGrouping: true,createPreHeaderPanel: true,showPreHeaderPanel: false,preHeaderPanelHeight: 40,draggableGrouping: {
            dropPlaceHolderText: 'Drop a column header here to group by the column',deleteIconCssClass: 'fa fa-times',**onGroupChanged: (e,args) => {
                if (args.caller === "add-group") {
                    const grpColumn = args.groupColumns
                    if (grpColumn.length > 0) {
                        const updatedColumn = []
                        const columnInfo = this.angularGrid.slickGrid.getColumns()
                        const uniqueRemoveColumn = []
                        grpColumn.forEach(column => {
                            const predefinedValues = column.predefinedValues[0]
                            columnInfo.forEach(columnDef => {
                                if (columnDef.id === predefinedValues.id) {
                                    this.tempColumnDefinitions.push(columnDef)
                                    this.hideColumn(columnDef)
                                }
                            });
                        });
                    }
                } else {
                    const getColumn = [...this.angularGrid.slickGrid.getColumns(),...this.tempColumnDefinitions]
                    this.angularGrid.slickGrid.setColumns(getColumn)
                }
                if (this.changeRef && !this.changeRef['destroyed']) {
        
                    this.changeRef.detectChanges();
                }
                this.gridObj.invalidate()
                this.gridObj.render()
            }**,onExtensionRegistered: (extension) => {
                this.draggableGroupingPlugin = extension
            },setDroppedGroups: (groupingInfo: any[]) => this.setDroppedGroups(groupingInfo)
        },};

onGroupChanged我已经处理了get列和set列。但是在“拖曳”字段之后，它在屏幕上挂起。我已附上了屏幕供您参考。