灌注下拉标签宽度

Question

我使用 primeng下拉列表输入，我想使包含标签占位符的div具有100％的宽度。
这是我的用法：

<div class="ui-grid ui-grid-responsive ui-fluid">
    <div class="ui-grid-row">
        <div class="ui-grid-col-2">
            <p-dropdown [options]="solutionsDropDownData" [(ngModel)]="solutionDropDownValue" placeholder="Solution..."
                [filter]="true" (onChange)="onSolutionChange($event)">
            </p-dropdown>
        </div>
    </div>
</div>

问题是我希望占位符为全角时在占位符后留一个空格 。该空间可以在下面看到：

当我选择其他值（例如，长度较小）时，空间的宽度会发生变化，如果我使用相同的示例，则宽度会变大。

我已经尝试过这种方法，但是没有一个起作用：

1. 使用了 autoWidth 参数，但是如果我将其与方括号一起使用，则会出现Can't bind to 'autoWidth' since it isn't a known property of 'p-dropdown'.错误；如果我不使用方括号使用该错误，该错误就会消失，但是它不起作用（我提到我导入了DropdownModule ）；

2. 使用了如下所示的css类（我分别使用了它们，或者两者都使用了）：

   .ui-dropdown-label-container { 宽度：100％！重要; }

   .ui-dropdown .ui-dropdown-panel { 最小宽度：100％！重要； 宽度：最大含量； }

3. 使用的样式参数。

Answer 1

发生这种情况是因为您为PrimeNG使用了样式表。我们遇到了相同的视觉问题，并通过在styles.css下面的css类下面添加了css

.ui-dropdown .ui-dropdown-label-container {
    width: inherit !important;
}

实际上inherit要求100%，我不明白为什么它对您不起作用。

Answer 2

我设法通过添加以下代码来解决此问题：

基本上，我只是将下拉列表添加到div中，并更改了包含该下拉列表的div的背景颜色。