<mat-slider> disable value change on click rage line
See original GitHub issuePlease describe the feature you would like to request.
- we need to one property using this we can control the range value change or not on click or touch on
<mat-slider>
line.
What is the use-case or motivation for this proposal?
I use material angular in my website its work good but when I use in a mobile device I face a problem like when I scroll down that time I touch by mistake on mat range slider reason for that my rage was change if I not want
So I want a solution for that like I need only mat-slider value will change when user drag handle of mat-slider instead of clicking slider.
Is there anything else we should know?
https://stackoverflow.com/questions/55205407/mat-slider-touch-issue-in-mobile-device
Issue Analytics
- State:
- Created 5 years ago
- Comments:7 (1 by maintainers)
Top Results From Across the Web
disable value change on click rage line Angular Material
I think you could try to work around it - e.g. fetching the instance of slider using @ViewChild , accessing the private properties...
Read more >Slider | Angular Material
Allows users to select from a range of values by moving the slider thumb. It is similar in behavior to the native <input...
Read more >ion-range: Slider Knob Controls with Labels - Ionic Framework
ion-range lets you select from a range of values by moving the slider. It accepts dual knobs but one controls the value and...
Read more >Easy Angular Testing – UI Elements – Slider and Slide Toggle
<mat-slider> allows for the selection of a value from a range via ... to pick our value, as well as a slide toggle...
Read more >Angular Display Mat Slider Value - StackBlitz
<div> · <span>Grid Size (px): </span><b · class="gridSizeValue">{{gridsize.value}}</b> · </div> · <mat-slider #gridsize (change)="updateSetting · ($event)" step="5" ...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
The change event is fired twice. See https://github.com/angular/material2/issues/14363 It’s a bug. If you click on the “range line” the event should also be fired only once. Only on pointer (mouse / touch) up. But your request to disable click on range-line is good. In other words: Only allow slider-thumb interaction.
Agree that this is an important request. We have the same issue with phone interactions. Users set the value of the slider by mistake while swiping vertically to scroll the form.