ag-grid-angular不显示数据

Question

获取并分配给数组的数据不会显示在ag-grid-angular组件中：

角度组件：

columnDefs = [
    { headerName: 'Id', field: 'id' },
    { headerName: 'Name', field: 'name' },
    { headerName: 'Login', field: 'login' },
    { headerName: 'Email', field: 'email' },
    { headerName: 'Role', field: 'role' },
    { headerName: 'Department', field: 'department' },
  ];

  rowData = Array();

  ngOnInit(): void {
    this.apiService.getAllUsers().subscribe(users => {
      users.forEach(user => {
        const item = {
          'id': user.id,
          'name': user.name,
          'login': user.login,
          'email': user.email,
          'role': user.role,
          'department': user.department
        };
        this.rowData.push(item)
      }, err => {
        this.errorMessage = err;
      })
    });

    console.log(this.rowData);
  }

Html：

<ag-grid-angular
  [columnDefs]="columnDefs"
  [rowData]="rowData"
  class = "ag-theme-balham standard-grid">
</ag-grid-angular>

网格：

​

​

控制台打印的数组数据：

​

​

除此之外，没有其他错误。

Answer 1

这是因为您将项目推送到rowData变量，在该变量中不会触发更改检测，因此您不会在网格中获得结果。

您可以做的是使用另一个单独的数组，并将项推入该数组，然后将该数组赋给rowData变量。或者您可以使用ag grid api方法setRowData来设置结果。