Angular Material MatFormField appearance="fill“主题问题

Question

我有一个关于角度材质主题的问题，特别是MatFormField指令。可能在Material v6周围，我发现matFormField指令有新的选项，比如appearance=" fill“和appearance="outline"，我发现appearance="fill”很有用，但我想知道如何更改正在使用的填充的背景色。

我已经尝试了一些方法，例如，

              <input class="w-100 bg-white form-control" #tileFilter 
          [formControl]="filterBy" 
          [matAutocomplete]="spiritilesAutocomplete"
          [matChipInputFor]="chipList"
          placeholder="Search by... Keyword, Author, Title, Story, etc."
          > 

我也试过选择

mat-form-field .mat-form-field-flex{
background-color: white; 

}

特别是选择和样式化mat-form-field的许多其他变体，但我找不到css选择器，也找不到文档中对背景色的api引用。我看到材料允许带下划线的部分和标签的主题，但我想特别针对背景颜色。谁能给我指一下正确的方向？也许我只是太无知了。

Answer 1

在这种情况下，请在组件css文件中使用ng-deep。

::ng-deep {
  .mat-form-field .mat-form-field-flex{
    background-color: white; 
  }
}

Answer 2

您需要将!important添加到背景颜色值，才能使其工作：

.mat-form-field-flex {
    background-color: white !important;
}