为什么 header 个单元格没有与 body 个单元格对齐？

Question

rowData: any = [];rowModelType = 'serverSide'; defaultColDef: any = { width: 50, sortable: true, resizable: true, }; columnDefs: any = [];rowSelection = 'single'; public getRowHeight: any; private paramRefreshAgGrid: any; private gridColumnApi: any; private gridApi: any; constructor() { this.gridOption() } gridOption() { this.columnDefs = [ { headerName: 'نوع ارز',field: 'currencyCode',width: 200, },{ headerName: 'خرید',field: 'buyEts', width: 200, }, { headerName: 'انتخاب', field: 'sellEts2', width: 200, }, { headerName: 'خرید', field: 'buyEts3', width: 200, }, { headerName: 'انتخاب', field: 'sellEts',width: 200, }, { headerName: 'خرید اضافه', field: 'buyExternalCheque', width: 200 } ,{ headerName: 'مبلغ', field: 'buyMoney', width: 200,}, ]; } onGridReady(params: any) { const $this = this; if (params) { this.gridApi = params.api;this.gridColumnApi = params.columnApi; this.paramRefreshAgGrid = params; } const datasource = { getRows(params: any) { const data: any = [ {currencyCode: 'Ford2', buyEts: 'Mondeo', sellEts: 32000, sellEts2: 32000 , sellEts3: 32000 , buyExternalCheque: 500 , buyMoney: 100000}, ] params.successCallback(data, data.total); $this.gridApi.sizeColumnsToFit(); } }; if (params) { params.api.setServerSideDatasource(datasource); } }
<ag-grid-angular
  style="width: 100%;"
  [ngStyle]="{'height': '50vh'  }"
  id="logGrid"
  class="ag-theme-balham"
  [columnDefs]="columnDefs"
  [defaultColDef]="defaultColDef"
  [enableRtl]="true"
  [rowModelType]="rowModelType"
  [animateRows]="false"
  [rowSelection]="rowSelection"
  [debug]="true"
  [rowData]="rowData"
  [getRowHeight]="getRowHeight"
  (gridReady)="onGridReady($event)"
  [paginationPageSize]="100"
  [suppressDragLeaveHidesColumns]="true"
</ag-grid-angular>

我在 Angular 11 中使用“ag-grid-angular”：“20.2.0”，当我滚动 header 时 header 单元格未与body 个单元格。

您有什么解决方案可以解决此错误？谢谢！！

Answer 1

ag-grid-angular 的 20.2.0 版本已有 2 年历史。尝试安装最新版本的 ag-grid-community 和 ag-grid-angular - 之后我也会删除 node_modules 文件夹并清理 npm install

这可能会解决问题（或至少缩小范围）

注意您应该在问题中强调该问题仅发生在 Chrome

为什么 header 个单元格没有与 body 个单元格对齐？

why header cells are not aligned with the body cells?

css

ag-grid

angular

ag-grid-angular