NZ Zorro，Ant design nz-table 动态列不对齐

Question

我有一个 table，其中的列是由服务器动态发送的。 Table headers 和数据列不对齐。

如何让它们对齐？

<nz-table *ngIf="queryResults" #headerTable [nzData]="queryResults" [nzFrontPagination]="false"
    [nzShowPagination]="false" [nzScroll]="{ y: '150px' }">
    <thead>
      <tr>
        <th *ngFor="let c of queryCols">{{c}}</th>
      </tr>
    </thead>
    <tbody>
      <tr *ngFor="let d of headerTable.data">
        <td *ngFor="let c of queryCols">{{ d[c] }}</td>
      </tr>
    </tbody>
  </nz-table>

Answer 1

修复 v8.5.x 或旧版本

中的 header 时需要为 th 指定 nzWidth

我们即将发布第 9 版（稳定版），它将自适应宽度。现在，你可以试试 https://next.ng.ant.design/components/table/en#components-table-demo-fixed-header

NZ Zorro，Ant design nz-table 动态列不对齐

NZ Zorro, Ant design nz-table dynamic columns does not align

angular

html-table

antd

ng-zorro-antd