<nz-table #table [nzData]="tableData" [nzPageSize]="15"> <thead> <tr> <th scope="col"><span jhiTranslate="global.field.id">ID</span></th> <th scope="col"><span jhiTranslate="toyoApp.equipment.type">Type</span></th> </tr> </thead> <tbody> <tr *ngFor="let equipment of table.data; trackBy: trackId" data-cy="entityTable"> <td> <a [routerLink]="['/equipment', equipment.id, 'view']">{{ equipment.id }}</a> </td> <td jhiTranslate="{{ 'toyoApp.EquipmentType.' + equipment.type }}">{{ equipment.type }}</td> </tr> </tbody> </nz-table> 以上angular代码中页码按钮没有居中应该怎么修改

可以在组件的 CSS 样式中添加以下代码来让页码按钮居中：

::ng-deep .ant-pagination {
  display: flex;
  justify-content: center;
}

这样就可以让页码按钮在水平方向上居中对齐了。同时，如果你想让按钮在垂直方向上也居中，可以将 `justify-content` 属性修改为 `center`，这样就可以在水平和垂直方向上都居中对齐了。

相关问题

以下这段代码显示的页码按钮没有显示在居中位置应该怎么修改 <nz-table #table [nzData]="tableData" [nzPageSize]="15"> <thead> <tr> </tr> </thead> <tbody> <tr *ngFor="let equipment of table.data; trackBy: trackId" data-cy="entityTable"> </tr> </tbody> </nz-table>

这段代码中并没有包含页码按钮的显示逻辑，因此无法确定具体的问题所在。

假设你是使用了 `nz-pagination` 组件来显示页码按钮，那么你可以设置 `nzShowTotal` 属性来显示总共有多少条数据，然后再通过 CSS 来调整页码按钮的位置，使其居中显示。示例代码如下：

<nz-table #table [nzData]="tableData" [nzPageSize]="15">
  <thead>
    <tr>
      <!-- 表头 -->
    </tr>
  </thead>
  <tbody>
    <tr *ngFor="let equipment of table.data; trackBy: trackId" data-cy="entityTable">
      <!-- 表格数据 -->
    </tr>
  </tbody>
</nz-table>

<nz-pagination [nzPageSize]="15" [nzTotal]="tableData.length" [nzShowTotal]="totalTemplate" class="pagination"></nz-pagination>

<ng-template #totalTemplate let-total let-range="range">
  共 {{total}} 条数据
</ng-template>

<style>
  .pagination {
    text-align: center; /* 将页码按钮居中 */
  }
</style>

你可以根据自己的实际情况来调整样式，以达到想要的效果。

<nz-table #table [nzData]="tableData" [nzPageSize]="15"> <thead> <tr> <th scope="col"><span jhiTranslate="global.field.id">ID</span></th> <th scope="col"><span jhiTranslate="toyoApp.equipment.type">Type</span></th> </tr> </thead> <tbody> <tr *ngFor="let equipment of table.data; trackBy: trackId" data-cy="entityTable"> <td> <a [routerLink]="['/equipment', equipment.id, 'view']">{{ equipment.id }}</a> </td> <td jhiTranslate="{{ 'toyoApp.EquipmentType.' + equipment.type }}">{{ equipment.type }}</td> </tr> </tbody> </nz-table> 以上代码中页码按钮没有居中应该怎么修改

可以在组件的 CSS 样式中添加以下代码来让页码按钮居中：

::ng-deep .ant-pagination {
  display: flex;
  justify-content: center;
}

这样就可以让页码按钮在水平方向上居中对齐了。同时，如果你想让按钮在垂直方向上也居中，可以将 `justify-content` 属性修改为 `center`，这样就可以在水平和垂直方向上都居中对齐了。