Can't set initial value

[TroyWolf]

Angular binding via ng-model only works one way. If I move the slider, my scope variable is changed accordingly. The binding from the UI to the script works. However, if I change the value of the scope variable, the slider does not change.

In fact, I am unable to set an initial value per the doc in the "slider" directive. e.g. value="7". I did find that if data-slider-value="7" does work to set the initial value. It does not, however, make the Angular binding work.

[rosenfeldalon]

Same issue here, I created a Stack Overflow ticket, so if anyone has this issue as well can find a solution once presented

[vim-zz]

+1

[dwjohnston]

+1

[dwjohnston]

Best solution for this is to set the initial value in a containing object.

ie.

<slider ng-model = "sliders.slider1Value" ... /> 

$scope.sliders = {
      slider1Value: 420
 }

[ikari-pl]

I seem to have half of this problem. If there is already a $scope.options = { valA: 5, valB: 10 }, and then the slider gets created, it does not see the initial value from the scope. Though if I switch the scope containing object after the slider is visible, the slider gets updated accordingly.

[lenniebriscoe]

I had a dig into the code and noticed that the Slider for Bootstrap (bootstrap-slider.js) uses the attribute "value" to set its initial values. See here for examples. Then in the angular-bootstrap-slider (slider.js) which this sits on, passes in two attributes "ngModel" and "value". The initSlider() function then does some decision making and messes around with the ngModel value incorrectly I believe. I found that if I ignore the "ngModel" and just rely on the "value" attribute I could default the initial value of the slider.

<span slider range="true" 
      precision="0" 
      scale="'logarithmic'" 
      ng-model="ngModel" 
      value="ngModel" 
      min="minValue" 
      step="1000" 
      max="maxValue"
      on-stop-slide="setValue()" 
      slider-tooltip="hide">
</span>

So in my case above (from my directive containing the slider) you can see I have set the directives ngModel the both the sliders ng-model (which I don't care about anymore) and also the value (which seems to work). ng-model is required by angular-bootstrap-slider so I had to provide it but it doesn't seem to hurt setting the value to the same attribute.