DropDown 与边距重叠

Question

我对 Angular 和 Primeng 中的 DropDown 有疑问。带有“style=width:100%”的 DropDown 与所选大文本的边框重叠。 then 控件的宽度大小不应取决于文本长度。

一个例子可以在https://stackblitz.com/edit/github-vur22c-cwrvzc找到

有人有解决方法吗？

Answer 1

p-dropdown 组件具有 style 属性，用于设置 p-dropdown 的宽度。

试试这个：

<h3>Test</h3>
<div style="width: 250px; height: 100px; padding: 20px; background-color: red">
  <p-dropdown [style]="{'width':'100%'}" [options]="options1" [(ngModel)]="selected1"></p-dropdown>
</div>

Example

Answer 2

then控件的宽度大小不应依赖于文本长度。

这应该可以解决问题。 在第一个 div 上设置（下拉菜单本身）：

p-dropdown > div 

或

 p-dropdown .ui-dropdown 

它是同一个选择器，由你决定使用哪一个:))

这个css属性：

position: relative;
width: 100%;

p-dropdown 更像是一个指令/组件，其中的所有内容都是您要查找的元素。