如何更改P日历Primeng内部下拉菜单的颜色

Question

我在Angular中使用Angular。我想更改显示在primeng组件p-calendar内部的下拉列表中选定元素的颜色，我尝试使用JavaScript选择元素，但未应用颜色。另外，我添加了一个选择器#calendar以在组件中使用viewchild，但我不知道是否可以通过这种方式来颂颂默认颜色。

有人知道这是否有可能吗？

非常感谢您

<p-calendar #calendar [inline]="inlineCalendar" [monthNavigator]="true" [yearNavigator]="true" [yearRange]="yearRangeValues" 
      [showButtonBar]="true" (onSelect)="onSelectDate($event)" (onMonthChange)="onSelectMonth($event)">

</p-calendar>


<p-calendar>
<select class="ui-datepicker-month ng-tns-c11-8 ng-star-inserted">
            <!--bindings={
  "ng-reflect-ng-for-of": "January,February,March,April,M"
}-->
            <option class="ng-tns-c11-8 ng-star-inserted" value="0">January</option>
            <option class="ng-tns-c11-8 ng-star-inserted" value="1">February</option>
            <option class="ng-tns-c11-8 ng-star-inserted" value="2">March</option>
            <option class="ng-tns-c11-8 ng-star-inserted" value="3">April</option>
            ...
        </select>
</p-calendar>

Answer 1

您可以在CSS下方结合使用primeng类来更改所选选项的颜色。

select.ui-datepicker-month:focus>option:checked{
  background-color: green;
}
select.ui-datepicker-year:focus>option:checked{
  background-color: red;
}

它将更改所选选项的颜色

这里是stackblitz