primeNG p-dropdown伸缩100%

Question

如何将primeNG下拉宽度设置为在其容器内伸展100%？

它似乎有固定的element.style和.ui-dropdown {width:100%}覆盖不起作用.

Answer 1

我发现使用响应方法并在容器中应用带有Grid CSS的.ui-fluid样式,而p-dropdown应该具有[autoWidth] ="false"属性.

例:

<div class="ui-grid ui-grid-responsive ui-fluid">
    <div class="ui-grid-row">
        <div class="ui-grid-col-12">
            <p-dropdown [autoWidth]="false"></p-dropdown>
        </div>
    </div>
</div>

Answer 2

在我的情况下,我使用autoWidth = false并设置样式attrribute,如下所示

<p-dropdown [options]="educationLevels" [(ngModel)]="selectedEducationLevel" 
name="educationlevel" autoWidth="false" [style]="{'width':'100%'}"></p-dropdown>

Answer 3

为了我，

[style]="{'minWidth':'100%'}"

行得通！

然后我是这样用的：

<span style="width: 100%">
   <p-dropdown [style]="{'minWidth':'100%'}" [options]="items" [(ngModel)]="selecteditem"></p-dropdown>
</span>