问题:
表格固定表头,增加滚动条,导致表格内列头和内容错位
解决办法
指定th的nzWidth属性
<nz-table [nzData]="targetData" [nzFrontPagination]="false"
[nzShowPagination]="false"
[nzScroll]="{ y: '500px' }">
<thead>
<tr>
<th nzWidth="60px">序号</th>
<th nzWidth="160px">工序描述</th>
<th nzWidth="110px">标准工时(分钟)</th>
<th nzWidth="110px">工序级别</th>
<th nzWidth="110px">标准工价(元)</th>
<th nzWidth="90px" *ngIf="editable">操作</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let data of targetData; index as i" cdkDrag>
<td>{{ i+1 }}</td>
<td>{{ data.desc }}</td>
<td>{{ data.sam }}</td>
<td>{{ data.grade }}</td>
<td>{{ data.price }}</td>
<td *ngIf="editable">
<button nz-button nzType="link" (click.stop)="delete(i)">删除</button>
</td>
</tr>
</tbody>
</nz-table>
修改后: