angular-rangeslider icon indicating copy to clipboard operation
angular-rangeslider copied to clipboard

Step attribute not working as expected

Open JerVoo opened this issue 9 years ago • 3 comments

I've been using the range slider for a while, but I just found out that the step attribute is not working as expected.

I'm using the following HTML:

<div
    range-slider
    min="0"
    max="10"
    step="0.01"
     orientation="horizontal"
     decimal-steps="2"
     model-min="data.constructies.perimeter.min"
     model-max="data.constructies.perimeter.max"
     >
 </div>

 <div class="row">
     <div class="col-md-5">
         <input type="number" ng-model="data.constructies.perimeter.min" class="form-control" step="0.01">
    </div>
    <div class="col-md-2 text-center">
        -
    </div>
    <div class="col-md-5">
        <input type="number" ng-model="data.constructies.perimeter.max" class="form-control" step="0.01">
    </div>
</div>

As you can see, the model is being used in the slider as well as in an number input. Both the slider and the input have the step attribute set to 0.01, but when using the slider, the steps are always 1, eventhough it's being set to 0.01. The step size of 0.01 does work in the number input, so the problem is not being cause by the input doing some wierd stuff with the data.

How can it be that this doesn't work?

JerVoo avatar Jan 13 '16 09:01 JerVoo

@JerVoo: can you solve this issue ? i have same issue it's working with decimal number like 1,2,5,10, but not working with fractional value like 0.1, .1, 0.02 etc.

umair-khanzada avatar Mar 02 '16 11:03 umair-khanzada

It's been a while since I looked at this but I think the problem is the rounding here:

proposal = Math.round(proposal / per) * per;

https://github.com/danielcrisp/angular-rangeslider/blob/master/angular.rangeSlider.js#L579

Basically step must be an integer otherwise this calculation doesn't work.

You could try scaling up your model values, so instead of 0-10 with a step of 0.01 you could use 0-1000 with a step of 1 and then scale them back down again in the UI / when you need to use them elsewhere.

Or perhaps someone could submit a PR with an improvement to the calculation?

danielcrisp avatar Mar 02 '16 12:03 danielcrisp

@danielcrisp : thank you for your response.

umair-khanzada avatar Mar 02 '16 13:03 umair-khanzada