Angular 更改mat微调器按钮的按钮颜色

我的页面上有一个按钮微调器控件。它只有三种颜色：原色、重音、警告色。我想要一个背景按钮颜色，它是我的网页的当前颜色。我试图使用styles.scss中的样式表来更改颜色，但颜色没有更改

.spinner-button {
background-color: currentColor;

}

下面是我的HTML文件中的代码：

 <mat-spinner-button  [options]="spinnerButtonOptions" (btnClick)="LoadData()" class="spinner-button" >
</mat-spinner-button>

下图：

---

我希望加载数据的按钮颜色为绿色，#5B39；与其他两个按钮类似：“开始加载”和“FTP”

您可以覆盖CSS并将ViewEn封装设置为无：

Component.css：

.mat-raised-button.mat-primary {
    background-color: red;
}

组件1.ts：

import { Component, ViewEncapsulation } from '@angular/core';
import { MatProgressButtonOptions } from 'mat-progress-buttons'

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css'],
  encapsulation : ViewEncapsulation.None // Here
})

---

工作如下：）

能否提供自定义

mat spinner按钮的HTML模板，以及typescript元数据和CSS？我不确定您想要什么以及如何实现它。我的HTML、typescript和HTML都粘贴在上面。mat spinner button

是您创建的自定义组件吗？我想@prashant pimpale得到了我的要求，并且已经回答了这个问题。您应该添加信息，说明您正在使用名为mat progress buttons的库

。这是一条重要的信息，可以让您更快地解决问题。请参阅下面@prashant pimpale的答案。嘿，我是插件作者，@prashant pimpale非常友好地创建了一个PR如何覆盖默认样式。如果这对您不起作用，请让我知道，我可以通过软件包本身找到另一种方法。（如果确实有效，请接受他的回答：））
import { Component, ViewEncapsulation } from '@angular/core';
import { MatProgressButtonOptions } from 'mat-progress-buttons'

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css'],
  encapsulation : ViewEncapsulation.None // Here
})