StepsArray won't update Ceil and Floor.

I’m changing the stepsArray dynamically after a http call, when I do so the floor and ceil slider values don’t change even though it says in the documentation that they should.

I cannot get the ceil and floor to change with stepsArray. Even if I specify it manually.

On HTTP Call, correct.

First drag, incorrect.

Back to the start, it’s reset.

I’m using:

<rzslider
    rz-slider-model="sliderMin"
    rz-slider-high="sliderMax"
    rz-slider-step-array="sliderSteps"
    rz-slider-options="slider.options">
</rzslider>

//Range Slider
    $scope.sliderSteps = [0, 1000]; //Default.
    $scope.sliderMax = $scope.sliderSteps[$scope.sliderSteps.length - 1];
    $scope.sliderMin = 0;
    $scope.slider = {
      options: {
        hideLimitLabels:false,
        translate: function(value) {
            return UserInfoService.getCurrencySymbol() + value; //TODO add currency multiplication here.
        }
      }
    };

....
....

//Set the steps after http call
var steps = 90;
var newSteps = [];
for (var i = 0; i < steps; i++) {
    newSteps.push(Math.round(min + ((max) * (i / steps))));
};
//Concat so angular updates as reference.
$scope.sliderSteps = [].concat(newSteps);
console.log($scope.sliderSteps);
console.log('min: ' + min + '| max: ' + max);

The console log results:

[129, 162, 196, 229, 262, 296, 329, 362, 396, 429, 462, 496, 529, 562, 596, 629, 662, 696, 729, 762, 796, 829, 862, 896, 929, 962, 996, 1029, 1062, 1096, 1129, 1162, 1196, 1229, 1262, 1296, 1329, 1362, 1396, 1429, 1462, 1496, 1529, 1562, 1596, 1629, 1662, 1696, 1729, 1762, 1796, 1829, 1862, 1896, 1929, 1962, 1996, 2029, 2062, 2096, 2129, 2162, 2196, 2229, 2262, 2296, 2329, 2362, 2396, 2429, 2462, 2496, 2529, 2562, 2596, 2629, 2662, 2696, 2729, 2762, 2796, 2829, 2862, 2896, 2929, 2962, 2996, 3029, 3062, 3096]
min: 129| max: 3000

[ollydixon]

Ok, so if you actually set the scoped vars of the ceil and floor from the html reference it doesn’t work. But if you set them directly in controller like so:

$scope.slider.options.floor = min;
$scope.slider.options.ceil = max;

It works. I still think that this is a bug, these are not being updated automatically.

[ollydixon]

Yeah if I put it in options it works thanks very much. 😃 (Keep up the great work)