Angular Material 6 在复选框和单选按钮上禁用波纹

Question

我遇到过这样一种情况，其中单选按钮紧靠容器的边缘，该容器嵌套了几层深，并且自动溢出。 Angular material 单选按钮具有波纹效果，会被剪裁。我没有重新设计整个东西，而是打算使用 disableRipple 关闭纹波。这适用于点击，但在组件之间切换时似乎不起作用，如本 stackblitz 所示。如下面的屏幕截图所示，我在顶部选择了选项 1，而不是单击。我尝试更新 css 以显示:无，但是当焦点改变时根本没有视觉提示。在我看来，涟漪效应应该叠加以避免剪裁问题，但这不是它的工作原理。那么有没有办法为选项卡和点击关闭它？

Answer 1

我知道这是一篇旧帖子，但我认为我可以帮助别人。您可以添加:

.mat-ripple-element{
  display: none !important;
}