expose labels on scope

Author: Liooo

dist/rzslider.css

@@ -1,7 +1,7 @@
 /*! angularjs-slider - v4.0.2 - 
  (c) Rafal Zajac <[email protected]>, Valentin Hervieu <[email protected]>, Jussi Saarivirta <[email protected]>, Angelin Sirbu <[email protected]> - 
  https://github.com/angular-slider/angularjs-slider - 
- 2016-06-07 */
+ 2016-06-23 */
 .rzslider {
   position: relative;
   display: inline-block;

dist/rzslider.js

@@ -1,7 +1,7 @@
 /*! angularjs-slider - v4.0.2 - 
  (c) Rafal Zajac <[email protected]>, Valentin Hervieu <[email protected]>, Jussi Saarivirta <[email protected]>, Angelin Sirbu <[email protected]> - 
  https://github.com/angular-slider/angularjs-slider - 
- 2016-06-07 */
+ 2016-06-23 */
 /*jslint unparam: true */
 /*global angular: false, console: false, define, module */
 (function(root, factory) {
@@ -762,7 +762,7 @@
           label.rzsv = valStr;
         }
 
-        label.html(valStr);
+        this.scope[which + 'Label'] = valStr
 
         // Update width only when length of the label have changed
         if (getDimension) {
@@ -2088,7 +2088,7 @@
   'use strict';
 
   $templateCache.put('rzSliderTpl.html',
-    "<div class=rzslider><span class=rz-bar-wrapper><span class=rz-bar></span></span> <span class=rz-bar-wrapper><span class=\"rz-bar rz-selection\" ng-style=barStyle></span></span> <span class=\"rz-pointer rz-pointer-min\" ng-style=minPointerStyle></span> <span class=\"rz-pointer rz-pointer-max\" ng-style=maxPointerStyle></span> <span class=\"rz-bubble rz-limit rz-floor\"></span> <span class=\"rz-bubble rz-limit rz-ceil\"></span> <span class=rz-bubble></span> <span class=rz-bubble></span> <span class=rz-bubble></span><ul ng-show=showTicks class=rz-ticks><li ng-repeat=\"t in ticks track by $index\" class=rz-tick ng-class=\"{'rz-selected': t.selected}\" ng-style=t.style ng-attr-uib-tooltip=\"{{ t.tooltip }}\" ng-attr-tooltip-placement={{t.tooltipPlacement}} ng-attr-tooltip-append-to-body=\"{{ t.tooltip ? true : undefined}}\"><span ng-if=\"t.value != null\" class=rz-tick-value ng-attr-uib-tooltip=\"{{ t.valueTooltip }}\" ng-attr-tooltip-placement={{t.valueTooltipPlacement}}>{{ t.value }}</span> <span ng-if=\"t.legend != null\" class=rz-tick-legend>{{ t.legend }}</span></li></ul></div>"
+    "<div class=rzslider><span class=rz-bar-wrapper><span class=rz-bar></span></span> <span class=rz-bar-wrapper><span class=\"rz-bar rz-selection\" ng-style=barStyle></span></span> <span class=\"rz-pointer rz-pointer-min\" ng-style=minPointerStyle></span> <span class=\"rz-pointer rz-pointer-max\" ng-style=maxPointerStyle></span> <span class=\"rz-bubble rz-limit rz-floor\">{{floorLabel}}</span> <span class=\"rz-bubble rz-limit rz-ceil\">{{ceilLabel}}</span> <span class=rz-bubble>{{modelLabel}}</span> <span class=rz-bubble>{{highLabel}}</span> <span class=rz-bubble>{{modelLabel}}-{{highLabel}}</span><ul ng-show=showTicks class=rz-ticks><li ng-repeat=\"t in ticks track by $index\" class=rz-tick ng-class=\"{'rz-selected': t.selected}\" ng-style=t.style ng-attr-uib-tooltip=\"{{ t.tooltip }}\" ng-attr-tooltip-placement={{t.tooltipPlacement}} ng-attr-tooltip-append-to-body=\"{{ t.tooltip ? true : undefined}}\"><span ng-if=\"t.value != null\" class=rz-tick-value ng-attr-uib-tooltip=\"{{ t.valueTooltip }}\" ng-attr-tooltip-placement={{t.valueTooltipPlacement}}>{{ t.value }}</span> <span ng-if=\"t.legend != null\" class=rz-tick-legend>{{ t.legend }}</span></li></ul></div>"
   );
 
 }]);

dist/rzslider.min.css

@@ -5,11 +5,11 @@
 </span> <!-- // 1 Highlight between two handles -->
 <span class="rz-pointer rz-pointer-min" ng-style=minPointerStyle></span> <!-- // 2 Left slider handle -->
 <span class="rz-pointer rz-pointer-max" ng-style=maxPointerStyle></span> <!-- // 3 Right slider handle -->
-<span class="rz-bubble rz-limit rz-floor"></span> <!-- // 4 Floor label -->
-<span class="rz-bubble rz-limit rz-ceil"></span> <!-- // 5 Ceiling label -->
-<span class="rz-bubble"></span> <!-- // 6 Label above left slider handle -->
-<span class="rz-bubble"></span> <!-- // 7 Label above right slider handle -->
-<span class="rz-bubble"></span> <!-- // 8 Range label when the slider handles are close ex. 15 - 17 -->
+<span class="rz-bubble rz-limit rz-floor">{{floorLabel}}</span> <!-- // 4 Floor label -->
+<span class="rz-bubble rz-limit rz-ceil">{{ceilLabel}}</span> <!-- // 5 Ceiling label -->
+<span class="rz-bubble">{{modelLabel}}</span> <!-- // 6 Label above left slider handle -->
+<span class="rz-bubble">{{highLabel}}</span> <!-- // 7 Label above right slider handle -->
+<span class="rz-bubble">{{modelLabel}}-{{highLabel}}</span> <!-- // 8 Range label when the slider handles are close ex. 15 - 17 -->
 <ul ng-show="showTicks" class="rz-ticks"> <!-- // 9 The ticks -->
   <li ng-repeat="t in ticks track by $index" class="rz-tick"
       ng-class="{'rz-selected': t.selected}" ng-style="t.style"

dist/rzslider.min.js

@@ -766,7 +766,7 @@
           label.rzsv = valStr;
         }
 
-        label.html(valStr);
+        this.scope[which + 'Label'] = valStr
 
         // Update width only when length of the label have changed
         if (getDimension) {