Using the rzslider within a an angular ui tabset breaks the UI of the slider widget. about angularjs-slider

[rzajac]

My first thought is that you may add your event in https://github.com/rzajac/angularjs-slider/blob/master/rzslider.js#L218.

Maybe you could create jsFiddle or Plunker then I could fix it in the next release.

[vikasgulati]

Yeah I have tried what you mentioned and it worked fine for me. Would add a pull request with what I did in a bit. Check the following plunker to see th bug!

http://embed.plnkr.co/qPV37a/preview

[vikasgulati]

@rzajac Can you look at this when you have a chance?

[vikasgulati]

There is one more issue with the slider within a tab. Two values can be seen when the slider value is set to minimum unlike when set to maximum!

[vikasgulati]

@rzajac - Can you merge the event binding pull request once?

[rzajac]

I've added reCalcViewDimensions event on master bramch.

[matt-way]

You should really wrap the event internals with a $timeout. If I combine the broadcast with things like ng-show, the updates happen before the correct size calculations can take place.

[paxal78]

Solution

$timeout(function() {
      $scope.renderSlider= true;
    });

... rzslider ng-if="renderSlider" ....