html - 如何在 Mat Chip Angular 中编辑 Mat Ripples 属性

Question

我正在开发一个在数据表中使用垫芯片的角度应用程序。但是，表中的数据存储在数据库中，并通过 HTTP 调用进行检索。因此，当我单击删除按钮时，波纹会一直延伸，直到表格刷新并且它会变得非常大。

有没有办法修改垫片或其他 Angular Material 元素的波纹半径？我知道我可以禁用它，但修改半径是最好的。

标签： htmlangularangular-materialangular-material-6

Answer 1

我不确定它是什么时候引入的，但是从 Material 版本 6.4.7 开始，添加了Ripples 模块，以更精细地控制涟漪的行为方式，允许定义涟漪半径、颜色等。使用这个新模块，您应该能够禁用每个组件的原生涟漪效应并用您自己的组件覆盖：

<mat-chip disableRipple matRipple matRippleRadius="10">One fish</mat-chip>

如果不禁用组件的原生波纹，每次点击都会产生两个波纹。