PrimeNG p-autocomplete 建议框没有正确重叠背景文本答案

【问题标题】：PrimeNG p-autocomplete suggestion box doesn't overlap the background text properlyPrimeNG p-autocomplete 建议框没有正确重叠背景文本
【发布时间】：2021-03-31 18:52:18
【问题描述】：

我使用了 PrimeNG 的 p-autocomplete，它似乎工作正常，只是建议框显示了选项，但背景文本也可见，这使得选项的清晰度很差。

我尝试设置 baseZIndex 和 autoZIndex 但没有任何效果。你能帮我看看有什么问题吗？

这是随附的屏幕截图以供参考。如果您查看两个虚拟选项 - 标记，惊奇两者都与第二个字段的标签重叠。

请提出建议。

<div class="form-group">
   <label for="company1">My First Company</label>
   <div class="col-sm-10">
      <p-autoComplete inputStyleClass="form-control rounded-0" [size]="100" 
        formControlName="firstCompany" [suggestions]="companies" 
        (completeMethod)="searchCompany($event)"
        field="name" [minLength]="1" forceSelection="true" field="name"></p-autoComplete>
   </div>
</div>

【问题讨论】：

你能在 Stackbliz 中创建这个问题吗？
我看看能不能加一个。

标签： javascript css angular primeng

【解决方案1】：

我终于设法解决了。问题是 style.css 中缺少primeng theme.css 导入。我在 style.css 文件中添加了以下行：

@import '../node_modules/primeng/resources/themes/bootstrap4-light-blue/theme.css'

感谢您的宝贵时间。

【讨论】：

【解决方案2】：

尝试将此属性放入 p-autocomplete:

appendTo="body"

【讨论】：

我也试过这个，但没有任何改变。