The Slider handle is positioned by default on the left of the bar and not by the value of the Model

[idanb11]

Hi @popsugarlegal ,
Thanks for your work... 👍

I am trying to implement the slider with the following values:

<slider floor="80" ceiling="260" step="20" ng-model="footerSlider" style="margin:0 !important;"></slider>

But when I set the value of footerSlider in the controller to be 120 the Slider handle is still positioned on the left of the bar and not positioned according to the value I set in the controller.
Please help.

Idanb11.

[idanb11]

To be more specific:
This problem exist if you change the value of the ng-model in the controller and the slider is hidden (false value of ng-show).
If the slider is visible - changing the value of the ng-model does update the slider handle position...

[dperuo]

I have this issue as well. I think it has to do with when the setPointers() function is called on initial page load.

A quick solution might be to force the ng-show state as true and hide the slider using a different method.

[BThvedt]

I ran into this problem. What I did was first I revealed the slider with ng-show, then I used the $timeout service, then updated the ng-model within the callback, something like this:

$scope.showSlider = true; // reveal the slider which is hidden via ng-show
// after that is done.. then use $timeout
$timeout(function() {
    $scope.sliderData = someValue; // now update the slider model
});

Anyway it worked for me for the time being.

[jaznow]

Same problem here... i have the slider on a hidden tab, and when I activate the tab, even if the value is set, the slider is at the left... :(