单击垫子按钮时如何更改背景颜色 - Angular？

Question

例如： https://material.angular.io/components/button/overview当我点击任何这些按钮时，按钮上添加了灰色背景效果。

我已经尝试过 ngdeep 并针对 mat 按钮的状态，例如焦点和活动。 但是，即使使用红色等背景颜色，我仍然可以看到灰色，而背景为白色，很明显灰色仍然存在。

Answer 1

您可以使用 disableRipple 为 true 来关闭材质按钮的波纹效果。 这样灰色背景效果就不会在单击按钮时出现。

<button mat-raised-button [disableRipple]="true">Basic</button>

您需要在根 module.ts 文件中添加以下配置

const globalRippleConfig: RippleGlobalOptions = {
  disabled: true,
  animation: {
    enterDuration: 300,
    exitDuration: 0
  }
};

@NgModule({
  providers: [
    {provide: MAT_RIPPLE_GLOBAL_OPTIONS, useValue: globalRippleConfig}
  ]
})

在此处查看详细链接

https://stackblitz.com/edit/angular-xvbzzq-yhgy5c?file=src/app/material-module.ts