Ionic 2 range touchend event

2019-04-02 09:17发布

问题:

I´m trying to get the value of a range slider with Ionic 2 at the end of an input.

In the doumentation the only availible event is the ionChange, which triggers several times during an input, and I only need the last value to perform an action.

I tried to add the touchend event manually but the event is ignored.

Here´s also a Plunker with the Problem.

<ion-range (ionChange)="showVal($event)" (touchend)="presentValue(event)" min="0" max="100" [(ngModel)]="currentTime" color="danger">
          <ion-icon small range-left name="sunny"></ion-icon>
          <ion-icon range-right name="sunny"></ion-icon>
     </ion-range>

Does anybody know a way to listen to an touchend event on the range slider in Ionic 2?

回答1:

There is also the ionBlur and ionFocus event on the range input you could use.

The ionFocus fires when you are sliding through the range and the ionBlur is fired when you have released the range item

<ion-range (ionBlur)="rangeBlurred($event)" (ionFocus)="rangeFocused($event)">


回答2:

"debounce" attribute of ion-range would work. "debounce" adds delay to emit the ionChange function from component.

<ion-range debounce="700" (ionChange)="someFunction($event)"></ion-range>

(700 is delay time in milliseconds) 700 works fine in my case.