typescript - 如何在Angular Material中通过鼠标调整ag-grid列的大小

Question

在 Angular 7 项目中，我有一个带有角度材料设计的 ag-grid。

如何通过拖动列标题中的锚点使网格列可调整大小，如下所示：https ://www.ag-grid.com/javascript-grid-resizing/#resizing-example

这是我的网格选项：

gridOptions: GridOptions = {
  context: {
    componentParent: this
  },
  floatingFilter: false,
  pagination: true,
  paginationPageSize: 100,
  enableColResize: true,
  cacheBlockSize: 100,
  rowDeselection: true,
  rowSelection: 'multiple',
  domLayout: 'autoHeight',
  defaultColDef: {
    sortable: true,
    resizable: true,
    suppressMenu: true,
    enableRowGroup: true,
  },
  rowGroupPanelShow: 'always',
  suppressDragLeaveHidesColumns: true, // Grouping
  suppressMakeColumnVisibleAfterUnGroup: true, // Grouping
  suppressRowClickSelection: true,
  onGridReady: (params: any) => this.onGridReady(params),
  // onRowDoubleClicked: (event) => this.onRowDoubleClick(event.data),
};

和 columDefs 看起来像这样：

var colDef: ColDef = {
  field: key,
  headerName: title,
  headerTooltip: title,
  minWidth: 10,
  maxWidth: 250
};