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( ''