diff --git a/src/components/slider/slider.js b/src/components/slider/slider.js
index b88594c7855..6b3528422d4 100644
--- a/src/components/slider/slider.js
+++ b/src/components/slider/slider.js
@@ -60,7 +60,7 @@ function SliderDirective($mdTheming) {
'
' +
'' +
'' +
- '' +
+ '' +
'
' +
'' +
'',
@@ -94,6 +94,7 @@ function SliderController($scope, $element, $attrs, $$rAF, $window, $mdAria, $md
this.init = function init(ngModelCtrl) {
var thumb = angular.element($element[0].querySelector('.md-thumb'));
+ var thumbText = angular.element($element[0].querySelector('.md-thumb-text'));
var thumbContainer = thumb.parent();
var trackContainer = angular.element($element[0].querySelector('.md-track-container'));
var activeTrack = angular.element($element[0].querySelector('.md-track-fill'));
@@ -367,7 +368,10 @@ function SliderController($scope, $element, $attrs, $$rAF, $window, $mdAria, $md
* @param x
*/
function adjustThumbPosition( x ) {
+ var exactVal = percentToValue( positionToPercent( x ));
+ var closestVal = minMaxValidator( stepValidator(exactVal) );
setSliderPercent( positionToPercent(x) );
+ thumbText.text( closestVal );
}
/**
diff --git a/src/components/slider/slider.spec.js b/src/components/slider/slider.spec.js
index 28b9d165c08..ad57080f5b6 100644
--- a/src/components/slider/slider.spec.js
+++ b/src/components/slider/slider.spec.js
@@ -41,6 +41,24 @@ describe('md-slider', function() {
expect($rootScope.value).toBe(50);
}));
+ it('should set model on drag', inject(function($compile, $rootScope, $timeout) {
+ var slider = $compile('')($rootScope);
+ $rootScope.$apply('value = 50');
+ var sliderCtrl = slider.controller('mdSlider');
+
+ spyOn(slider[0].querySelector('.md-track-container'), 'getBoundingClientRect').andReturn({
+ width: 100,
+ left: 0,
+ right: 0
+ });
+
+ sliderCtrl._onInput( simulateEventAt( 30, Hammer.INPUT_START ));
+ $timeout.flush();
+
+ sliderCtrl._onPan( simulateEventAt( 80 ));
+ expect(slider[0].querySelector('.md-thumb-text').textContent).toBe('80');
+ }));
+
it('should increment model on right arrow', inject(function($compile, $rootScope, $timeout, $mdConstant) {
var slider = $compile(
''