Angular-bootstrap-slider Get Value As String

Using angular-bootstrap-slider based on bootstrap-slider. I'm trying to get the value of a color by name (string), based my work on previous questions such as Here where there is a

Solution 1:

I got what you were looking for working in this plunker, but there's definitely some weird behavior with the slider. I could only get it working by using the onStartSlide attribute within the directive to trigger a callback to select the color.

<slider ng-model="colors" 
        ticks="colorTypeSlider.ticks"
        ticks-labels="colorTypeSlider.ticks_labels"
        ticks-snap-bounds="colorTypeSlider.ticks_snap_bounds" 
        on-start-slide="selectColor($event,value,colorTypeSlider.ticks_labels)"></slider>

And I couldn't pass the $scope.colors array (of objects) to the function for some reason, it only worked with a an array of strings. Anyway, here's the function I used:

$scope.selectColor = function ($event,value,collection) {
  console.log('value is ' + value);
  $scope.selectedColor = collection[value];
};

And I passed in the $scope.colorTypeSlider.ticks_labels as the collection.

Hope this helps you...