search

NG-ZORRO / ng-zorro-antd

Angular UI Component Library based on Ant Design
https://ng.ant.design
MIT License
8.8k stars 3.85k forks source link

TreeSelect树选择之属性nzDropdownMatchSelectWidth无效 #8612

Open 232650413 opened 1 week ago

232650413 commented 1 week ago

Reproduction link

https://angular-ue1h1c.stackblitz.io

Steps to reproduce

设置style="width: 100px"，添加[nzDropdownMatchSelectWidth]="false"属性，下拉面板与其不同宽；设置无效。 QQ截图20240628195141

What is expected?

设置style="width: 100px"，添加[nzDropdownMatchSelectWidth]="false"属性，下拉面板与其不同宽；设置有效。

What is actually happening?

设置style="width: 100px"，添加[nzDropdownMatchSelectWidth]="false"属性，下拉面板与其不同宽；设置无效。

Environment Info
ng-zorro-antd 18.0.1
Browser chrome
zorro-bot[bot] commented 1 week ago

Translation of this issue:

TreeSelect tree selection attributes NZDropdownMatchSelectWidth are not effective

REPRODUCTION LINK

[https://angular-ue1h1c.stackblitz.io] (https://angular-ue1h1c.stackblitz.io)

STEPS To Reproduce

Set style = "width: 100px", add [nzdropdownmatchselectwidth] = "false" attribute, and the downhill panel is different from it; the settings are invalid. ! [QQ screenshot 20240628195141] (https://github.com/ng-zorro/ng-zorro-Ntd/assets/15223841/ce8d044e-C4E1-435a- D28D9B2DA94A)

What is exfected?

Set style = "width: 100px", add [nzdropdownmatchselectwidth] = "false" attribute, and the downhill panel is different from it; the settings are valid.

What is actually happy?

Set style = "width: 100px", add [nzdropdownmatchselectwidth] = "false" attribute, and the downhill panel is different from it; the settings are invalid.

ENVIRONMENT Info
NG-Zorro-ATD 18.0.1
Browser Chrome
ParsaArvanehPA commented 6 days ago

Hi @232650413, It is not possible to set the width of the dropdown drawer via setting the style tag directly on the <nz-tree> tag; because it set the styles on the parent tag, not the one created with CDK's overlay. For this you need to use nzDropdownMatchSelectWidth and nzDropdownStyle together. Like this:

[nzDropdownMatchSelectWidth]="false"
[nzDropdownStyle]="{width: '500px'}"

I hope this fixes your problem.

232650413 commented 2 days ago

Hi @232650413, It is not possible to set the width of the dropdown drawer via setting the style tag directly on the <nz-tree> tag; because it set the styles on the parent tag, not the one created with CDK's overlay. For this you need to use nzDropdownMatchSelectWidth and nzDropdownStyle together. Like this:

[nzDropdownMatchSelectWidth]="false"
[nzDropdownStyle]="{width: '500px'}"

I hope this fixes your problem.

嗯，看到过，但就想 一个属性搞定