ng 选择样式组标题和项目

Question

我在我的 Angular 项目中使用 ng-select ( https://ng-select.github.io/ng-select#/data-sources ) 库来显示下拉列表，如下所示：

<ng-select
  [items]="flattenedSelectList"
  bindLabel="displayName"
  placeholder="Select specialty"
  notFoundText="No results found. Please try a different search criteria."
  bindValue="id"
  groupBy="type"
  [(ngModel)]="selectedSpecialtyId">
</ng-select>

我想设置组标题以及每个组内的项目的样式？我该怎么做？

我在 .scss 文件中使用了以下内容，但它似乎没有应用更改。ng-optgroup 用于组标头，ng-option-label 用于项目。

.ng-optgroup {
  font-weight: bold;
  color: #dbe8ef;
}

.ng-option-label{
  color: red;
}

Answer 1

使用这种风格并添加到核心文件中style.css：

.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup{
  font-weight: bold;
  color: #dbe8ef;
}
.ng-option-label{
  color: red;
}

堆栈闪电战：https://stackblitz.com/edit/angular-ztb1ug