Ag grid 如何使用ag网格根据API响应动态显示列

下面是ag grid的代码及其在this.gridApi.setColumnDefsthis.columnDefs上的获取错误。有人可以指导如何解决此问题：

<ag-grid-angular " 
class="ag-theme-balham"
#agGrid
[columnDefs]="columnDefs"
id="newGrid"
[enableSorting]="true"
[enableFilter]="true"
[modules]="modules"
[paginationAutoPageSize]="true"
[rowData]="rowData"
[defaultColDef]="defaultColDef"
(gridReady)="onGridReady($event)"
[pagination]="true">>
</ag-grid-angular>

的gridApi仅在onGridReady事件之后可用。关于如何拥有gridApi实例的更多细节，可以在几乎每个ag网格示例中找到

参考：

现在，该怎么办

在这种情况下，不需要显式调用gridApi.setColumnDefs。在迭代从服务器接收的列详细信息时，只需将它们推送到组件的columnDefs中。在模板中，您已经将columnDefs数组传递给ag网格。

public getcolumnData()


      {
        let columnDefs=[];
        this.GetGridData();
        let header:any =[];
        Object.keys(this.JSONDATA).forEach(function(key) {
          header.push(key)
        }); 

         console.log("header.........",header)
          columnDefs=[...columnDefs,{headerName:header,field: header  }];

      });
      this.gridApi.setColumnDefs(this.columnDefs)
  }

    this.columnDefs = [];
    this.columnDefs.push({
      headerName: header, field: header
      // ... other details
    });