OK, there’s a workaround/fix to this. It’s based on the Ionic version 1.x solution to a similar problem as described in this forum discussion.
That discussion points you to this this issue and the solution is based on the solution/workaround provided by user ArTiSTiX (thanks!).
In brief: create a directive (@Component
) whose template is <input type="range" ... >
and set up the touchstart
and mousedown
events of the <input ... >
element to run a function that calls $event.stopPropagation()
. Here’s a code snippet:
@Component({
selector: 'slider',
template: '<input type="range" (touchstart)="onDrag($event)" (mousedown)="onDrag($event)">'
})
export class Slider {
onDrag($event) {
$event.stopPropagation();
}
}
If you think there’s a better solution, please let me know, thanks!