Style Prime-ng 下拉子元素

Question

我正在尝试为 prime-ng 下拉列表中的元素设置样式。这些样式是在标签中找到的子元素，我不确定如何访问它们。这是代码，我把不相关的都去掉了。

<p-dropdown _ngcontent-c12="" id="src" placeholder="Please select" class="ng-tns-c19-2 ng-untouched ng-pristine ng-valid ui-inputwrapper-filled" ng-reflect-placeholder="Please select" ng-reflect-options="[object Object],[object Object" ng-reflect-model="4">
    <div class="ng-tns-c19-2 ui-dropdown ui-widget ui-state-default ui-corner-all ui-helper-clearfix" ng-reflect-ng-class="[object Object]" style="width: 246px;">
    </div>
</p-dropdown>

我正在尝试设置元素内部的样式。我只在我的浏览器中看到，但在我的 HTML 代码中看不到。 div 在使用时自然会创建。

Answer 1

将 p-dropdown 选择器与 ::ng-deep 一起使用，并在 class/selector 之后添加您想要的样式

例如为列表内容设置颜色：

p-dropdown ::ng-deep  .mat-list-item-content{
  color:red;
}

See example

Style Prime-ng 下拉子元素

Style Prime-ng dropdown child elements

css

primeng