角度5+ag网格-使用带媒体查询的ag网格

最后,我得到了一个解决方案,目前运行良好。我提出了一个条件 onGridReady() 它最初检测屏幕大小的宽度,因此它可以动态地启动 autoSizeColumns() 或 sizeColumnsToFit()

  onGridReady(params) {
    setTimeout(() => {
      this.gridApi = params.api;
      this.gridColumnApi = params.columnApi;   
      const eGridDiv = document.querySelector('.my-grid');
      const allColumnIds = [];
      if (eGridDiv.clientWidth <= 768) {
        this.gridColumnApi.getAllColumns().forEach(function(column) {
          allColumnIds.push(column.colId);
        });
        this.gridColumnApi.autoSizeColumns(allColumnIds);
      } else {
        params.api.sizeColumnsToFit();
      }      
    }, 500);
  }

<ag-grid-angular 
style="width: auto; height: 60vh;"
class="ag-theme-balham my-grid"
[rowData]="data" 
[columnDefs]="columns"
[enableColResize]="true"
(gridReady)="onGridReady($event)">
</ag-grid-angular>