如何在Angular Material 15中禁用mat-button的波纹与悬浮效果

disableRipple属性并没有失效，但在Angular Material 15（基于MDC底层重构后），它的作用范围发生了变化：

• 旧版本（Angular Material 12及更早）中，disableRipple会同时关闭点击波纹和悬浮波纹，并抑制部分悬浮样式
• 新版本（Angular Material 15）中，disableRipple仅关闭点击触发的波纹，而MDC按钮默认自带的悬浮持久波纹和悬浮 elevation（阴影）变化不受该属性控制

无需CSS的解决方案 #

要实现完全无波纹、无任何悬浮效果的按钮，可以组合使用以下两个属性：

<button mat-button [disableRipple]="true" [disableElevation]="true">DoSomething</button>

• [disableRipple]="true"：关闭点击触发的波纹效果
• [disableElevation]="true"：关闭悬浮时的阴影提升效果

如果仍然存在悬浮时的波纹（持久化波纹），可以切换为纯文本按钮变体来彻底移除所有波纹相关默认样式：

<button mat-text-button [disableRipple]="true">DoSomething</button>

mat-text-button本身默认无填充、阴影和悬浮波纹，仅保留文字颜色的hover变化；若连该颜色变化都不需要，可结合disableElevation并补充少量CSS调整（但这已超出纯模板属性的解决方案范围）。

内容的提问来源于stack exchange，提问作者Kenny vm