css - 每个组件的样式 mat-select-value

Question

我正在尝试为每个组件设置不同的 mat-select 样式。我的(始终可见的)标题中有 1 个主要选择，我的 SPA 中的不同组件中有多个。我正在尝试以不同方式设置标题 mat-select 的样式，因为它具有深色背景，其余部分应该没有样式，并且不受标题样式的影响。

我尝试过使用 ngClass 和 ngStyle，但它们不会将所需的类添加到子类中，而只是添加到主类中。我试过使用::ng-deep 和/deep/但它们改变了应用程序其他部分的组件样式。所以从技术上讲它们是有效的，但结果是错误的。

https://stackblitz.com/edit/angular-kzwatd

我希望将文本颜色更改为白色，因为 mat-select 的背景是深色的。

有人知道为什么 stackblitz 不起作用吗？

Answer 1

尝试使用:

  <mat-select class="main" placeholder="Main"> ....

  /deep/ .main .mat-select-value{
    color: red;
  }

https://stackblitz.com/edit/angular-rucggb?file=src/app/main-component.css