Adjust width of some column in Nz-Table dynamic columns

Question

I am using Nz-Zorro ie; ng-antd to design table. Here I am dynamically calling the table header.

I have 4 columns and I want reduce the width of 2 columns by its name. How can I do that ?

<thead>
   <tr>
     <th *ngFor="let column of listOfColumns">
       {{ column.name }}
     </th>
   </tr>
</thead>

Answer 1

you can add a colWidth: "string" property to each of your listOfColumns item's class and change it in your model with your model key. then use [nzWidth] to change the column width:

<thead>
   <tr>
     <th  *ngFor="let column of listOfColumns" [nzWidth]="column.colWidth">
       {{ column.name }}
     </th>
   </tr>
</thead>