Как вызвать событие изменения для html тип ввода = диапазон, когда значение ползунка совпадает с начальным значением

Question

У меня есть html тип ввода = бегунок диапазона, например:

<input type="range" min="0" max="5" step="0.1" value="0" class="slider" id="aroma-slider" (input)="trackInput($event, 'aroma')" (change)="slideDone($event, 'aroma')">

Мои события запускаются великолепно, КРОМУ, если пользователь перетаскивает ползунок полностью до 0 , тогда событие change не вызывается, даже если пользователь взаимодействовал со слайдером и перемещал его. Я предполагаю, что это потому, что значение ползунка совпадает с исходным значением ползунка в атрибуте value. Как вызвать событие изменения, если начальное и конечное значения ползунка совпадают? В моем случае пользователь, выбирающий значение 0, действителен.

Answer 1

Я нашел обходной путь, прослушав все события mouseup и touchend, а затем отфильтровав их так, чтобы они действовали только на события, происходящие на слайдере:

<input type="range" min="0" max="5" step="0.1" value="0" class="slider" id="aroma-slider" (input)="trackInput($event, 'aroma')" (change)="slideDone($event, 'aroma')">

$(document).on('mouseup touchend', (e:Event)=> {
    if ( $(e.target).attr('class') == 'slider' &&  $(e.target).val() == 0 ) {
        this.slideDone(e, 'aroma');
    }
});