Slider doesn't work inside ui-bootstrap $modal

[Urigo]

Hi Guys, is this repo still maintained? If so, it seems like the slider isn't responding inside a $modal.

Thanks!

[vdest]

I can confirm this. The slider doesn't update properly and initial position is always 0 when used inside modal regardless of ng-model's value. When placed outside modal, it sets correctly.

[karol-f]

I will add that this behaviour is not only in $modal. I checked also "tab" directive form ui-bootstrap and it is the same.

[assafweinberg]

The slider doesn't move to the initial position when opened in a tab or a modal because angular-slider depends on the offsetWidth of the bar to set the position of the slider at render time - which is 0 when the slider is hidden (like in a tab or modal). Opening the bootstrap modal doesn't trigger anything that causes the slider to update its dom.

I'm not sure what the best way around this is right now, it would be nice to watch for bar width changes and recalculate, but for now you could broadcast a "modalOpened" event on the root scope and listen for it inside angular-slider :-\ - e.g.

//add this around line 325 of angular-slider.js scope.$on('modalOpened', function(){ $timeout(updateDOM,500); });

[assafweinberg]

Alternatively, the slider re-renders when the ng-model is changed, so you could sidestep this by adding and removing 1 from the model after your modal is open. Hacky, but at least it doesn't require forking.

[ozgen]

rzSlider which is in the modal html also doesn't work when open the modal... is there any solution for this situation?