原文链接：nz-select下拉框自适应宽度 – 每天进步一点点
数据如下：
listOfData=[ { "name":"标题1", "id":"1" }, { "name":"标题12", "id":"2" }, { "name":"标题123", "id":"3" }, { "name":"标题1234", "id":"4" }, { "name":"标题12345", "id":"5" }, ] <nz-select > <nz-option *ngFor="let item of listOfData" [nzLabel]="item.name" [nzValue]="item.id" > </nz-option> </nz-select>使用nz-select时，如果没有指定宽度就会是下面的样子：
如果设置宽度是80px,那么就会变成这样：
<nz-select style="width: 80px;" > <nz-option *ngFor="let item of listOfData" [nzLabel]="item.name" [nzValue]="item.id" > </nz-option> </nz-select>
如果宽度设置成300px，就会变成下面这样：
可以看出，如果宽度设置过长就浪费了很多空间，如果设置了过短就无法显示部分数据。所以我们需要设置自适应宽度。
代码如下：
<nz-select [nzDropdownStyle]="{ width: 'fit-content', 'min-width': '80px' }" style="min-width: 80px;" > <nz-option *ngFor="let item of listOfData" [nzLabel]="item.name" [nzValue]="item.id" > </nz-option> </nz-select>
通过设置最小宽度80px, 然后设置宽度自适应即可。
标签：name,id,nz,宽度,设置,下拉框,select From： https://www.cnblogs.com/longkui-site/p/18487808