primeng 下拉标签宽度
primeng dropdown label width
我使用 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>
问题是我在占位符后面得到了一个 space,而我希望占位符是全角 。 space 如下所示:
当我选择其他值时,例如长度较小,space 的宽度会改变,如果我使用相同的示例,它会变大。
我已经尝试过这种方法,但是 none 有效:
使用了autoWidth参数,但是如果我用括号使用它,这个会给我Can't bind to 'autoWidth' since it isn't a known property of 'p-dropdown'.
错误;如果我在没有括号的情况下使用它,错误就会消失,但它不起作用(我提到 我导入了 DropdownModule);
使用 css 类 如下所示(我分别使用它们,或者两者都使用):
.ui-下拉标签容器{
width:100%!重要;
}
.ui-下拉 .ui-下拉面板 {
最小宽度:100%!重要;
宽度:最大内容;
}
使用样式参数。
这是因为您为 PrimeNG 使用的样式表。我们遇到了同样的视觉问题,并通过将 css class 添加到 styles.css
来实现
.ui-dropdown .ui-dropdown-label-container {
width: inherit !important;
}
实际上 inherit
需要 100%
,我不明白为什么它对你不起作用。
我通过添加以下代码设法解决了这个问题:
基本上,我只是在 div 中添加了下拉菜单,并更改了包含它的 div 的背景颜色。
我使用 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>
问题是我在占位符后面得到了一个 space,而我希望占位符是全角 。 space 如下所示:
当我选择其他值时,例如长度较小,space 的宽度会改变,如果我使用相同的示例,它会变大。
我已经尝试过这种方法,但是 none 有效:
使用了autoWidth参数,但是如果我用括号使用它,这个会给我
Can't bind to 'autoWidth' since it isn't a known property of 'p-dropdown'.
错误;如果我在没有括号的情况下使用它,错误就会消失,但它不起作用(我提到 我导入了 DropdownModule);使用 css 类 如下所示(我分别使用它们,或者两者都使用):
.ui-下拉标签容器{ width:100%!重要; }
.ui-下拉 .ui-下拉面板 { 最小宽度:100%!重要; 宽度:最大内容; }
使用样式参数。
这是因为您为 PrimeNG 使用的样式表。我们遇到了同样的视觉问题,并通过将 css class 添加到 styles.css
来实现.ui-dropdown .ui-dropdown-label-container {
width: inherit !important;
}
实际上 inherit
需要 100%
,我不明白为什么它对你不起作用。
我通过添加以下代码设法解决了这个问题:
基本上,我只是在 div 中添加了下拉菜单,并更改了包含它的 div 的背景颜色。