1

I have an app that uses Angular Material Stepper component.

<mat-horizontal-stepper>

How can I disable 'ripple' behavior on click by step tabs without CSS-hacks?

Thanks!

Anshuman Jaiswal
  • 5,352
  • 1
  • 29
  • 46
Pavlo Kit
  • 23
  • 3

1 Answers1

0

I assume we are talking about the material2 library as you tagged Angular 6, I will be referencing the Material2 library below.

I looked at the material js library and do not see a stepper.

looking at tab-group.ts as a reference we can look at how the inputs are defined in the constructor... this line specifically accepts disableRipple

 inputs: ['color', 'disableRipple'],

https://github.com/angular/material2/blob/master/src/lib/tabs/tab-group.ts

looking at the stepper.ts for comparison, unfortunately, there currently is not an input to disableRipple in the constructor.

https://github.com/angular/material2/blob/master/src/lib/stepper/stepper.ts

I believe there is no logic to disable ripple on the stepper that I can tell.

  • If your preference is to not use CSS hacks, this unfortunately will be a feature request that will need to be submitted.
Marshal
  • 10,499
  • 2
  • 34
  • 53
  • Thanks for reply. Actually it is the lib: https://material.angular.io/components/stepper/overview – Pavlo Kit Oct 04 '18 at 19:23
  • correct, that is the material 2 library. My links above are accurate to the source for your link. if my answer was satisfactory, please mark it as such. I could use the rep. – Marshal Oct 04 '18 at 19:45