angular 实现 agrid边框可以拖动

可以通过使用 `Resizable` 指令来实现 ag-grid 边框的拖动调整大小。具体实现步骤如下：

1. 在组件的 `NgModule` 中引入 `ResizableModule`：

import { NgModule } from '@angular/core';
import { ResizableModule } from 'angular-resizable-element';

@NgModule({
  imports: [
    // ...
    ResizableModule
  ],
  // ...
})
export class YourModule { }

2. 在组件的 HTML 模板中使用 `Resizable` 指令，并将其绑定到 ag-grid 的表头上：

<ag-grid-angular 
  #agGrid
  [rowData]="rowData"
  [columnDefs]="columnDefs"
  class="ag-theme-alpine"
  (gridReady)="onGridReady($event)"
>
  <ag-grid-column 
    headerName="Column 1" 
    field="col1" 
    resizable
    [resizableConfig]="{ edges: { left: true } }"
  ></ag-grid-column>
  <ag-grid-column 
    headerName="Column 2" 
    field="col2" 
    resizable
    [resizableConfig]="{ edges: { right: true } }"
  ></ag-grid-column>
</ag-grid-angular>

3. 在组件的 CSS 样式中为 ag-grid 的表头添加一些样式，使其看起来更像是可以拖动的边框：

.ag-header-cell {
  position: relative;
}

.ag-header-cell::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  width: 5px;
  background-color: #ccc;
  cursor: col-resize;
}

这样，就可以实现 ag-grid 的边框拖动调整大小了。需要注意的是，`resizableConfig` 属性可以用来指定边框可以拖动的方向，这里的示例中分别指定了左侧和右侧边框可以拖动。