手动设置列宽时，隐藏在网格菜单图标后面的Angular Slick-grid列选择器图标

如何解决手动设置列宽时，隐藏在网格菜单图标后面的Angular Slick-grid列选择器图标

我正在为我的项目使用angular-slickgrid。手动设置列宽时，列选择器图标隐藏在网格菜单图标的后面。我发现此link中的排序图标也解决了相同的问题。但是我找不到列选择器图标的解决方案。

我当前的angular slick-grid版本为2.19.0，我也尝试将其升级到2.22.1，但仍然相同。但是即使我手动设置了宽度，demo也没有此问题。我找不到我想要的东西。

GridOptions = {
  enableAutoSizeColumns: false,autoFitColumnsOnFirstLoad: false,enablePagination: true,enableAutoResize: true,enableSorting: true,enableFiltering: true,i18n: this.translateService,showPreHeaderPanel: false,createPreHeaderPanel: true,rowHeight: 40,preHeaderPanelHeight: 40,gridMenu: {
    hideExportExcelCommand: 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",{
        command: "cspfm-groupby",titleKey: "Group-by",iconCssClass: "icon-mat-account_tree",callbackArgs) => {
          this.openDraggableGroupingRow(childObjectName)
        }
      },{
        command: "cspfm-clear-groupby",titleKey: "Clear Grouping",iconCssClass: "fa fa-times",callbackArgs) => {
          this.clearGrouping(childObjectName)
        }
      }
    ],},enableDraggableGrouping: true,draggableGrouping: {
    dropPlaceHolderText: 'Drop a column header here to group by the column',deleteIconCssClass: 'fa fa-times',onGroupChanged: (e,args) => {
      this.onGroupChanged(args,childObjectName)
    },onExtensionRegistered: (extension) => {
      const childObject = this.getChildObject(childObjectName);
      childObject['draggableGroupingPlugin'] = extension
    },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: "",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)
  }
}

columnDefinition = [{
  id: this.tableColumnInfo['pfm1941']['pfm2061_3121_departmentname']['id'],nameKey: this.tableColumnInfo['pfm1941']['pfm2061_3121_departmentname']['label'],field: this.tableColumnInfo['pfm1941']['pfm2061_3121_departmentname']['prop'],sortable: true,type: FieldType.string,exportCustomFormatter: CspfmDataFormatter,// minWidth: this.columnMinWidth,formatter: CspfmDataFormatter,width: 250,filterable: true,filter: {
    model: Filters.compoundInput
  },grouping: {
    getter: (data) => {
      return this.getter(data,this.tableColumnInfo['pfm1941']['pfm2061_3121_departmentname'])
    },formatter: (groupingFormatterItem: GroupingFormatterItem) => {
      return this.formatter(groupingFormatterItem,this.tableColumnInfo['pfm1941']['pfm2061_3121_departmentname']['label'])
    },predefinedValues: [this.tableColumnInfo['pfm1941']['pfm2061_3121_departmentname']],collapsed: true
  },cssClass: 'left-align',params: {
    columnWidth: 100,pipe: this.cspfmDataDisplay,fieldInfo: this.tableColumnInfo['pfm1941']['pfm2061_3121_departmentname']
  }
}]

输出：