diff --git a/src/timepicker/docs/readme.md b/src/timepicker/docs/readme.md
index d14fc6d113..7815c1ee37 100644
--- a/src/timepicker/docs/readme.md
+++ b/src/timepicker/docs/readme.md
@@ -57,6 +57,11 @@ A lightweight & configurable timepicker directive.
-
Date object that provides the time state.
+* `pad-hours`
+ $
+ _(Default: true)_ -
+ Whether the hours column is padded with a 0.
+
* `readonly-input`
$
C
diff --git a/src/timepicker/test/timepicker.spec.js b/src/timepicker/test/timepicker.spec.js
index 21ccfeabd8..7e9dfbc804 100644
--- a/src/timepicker/test/timepicker.spec.js
+++ b/src/timepicker/test/timepicker.spec.js
@@ -986,6 +986,37 @@ describe('timepicker directive', function() {
});
});
+ describe('`pad-hours` attribute', function() {
+ function triggerInput(elem, val) {
+ elem.val(val);
+ elem.trigger('input');
+ }
+
+ it('should not pad the hours by default', function() {
+ element = $compile('')($rootScope);
+ $rootScope.$digest();
+
+ var inputs = element.find('input');
+ var hoursInput = inputs.eq(0);
+ triggerInput(hoursInput, 4);
+ hoursInput.blur();
+
+ expect(hoursInput.val()).toBe('04');
+ });
+
+ it('should not pad the hours', function() {
+ element = $compile('')($rootScope);
+ $rootScope.$digest();
+
+ var inputs = element.find('input');
+ var hoursInput = inputs.eq(0);
+ triggerInput(hoursInput, 4);
+ hoursInput.blur();
+
+ expect(hoursInput.val()).toBe('4');
+ });
+ });
+
describe('setting uibTimepickerConfig steps', function() {
var originalConfig = {};
beforeEach(inject(function(_$compile_, _$rootScope_, uibTimepickerConfig) {
diff --git a/src/timepicker/timepicker.js b/src/timepicker/timepicker.js
index e969d05126..6a6171d2eb 100644
--- a/src/timepicker/timepicker.js
+++ b/src/timepicker/timepicker.js
@@ -18,7 +18,8 @@ angular.module('ui.bootstrap.timepicker', [])
var selected = new Date(),
watchers = [],
ngModelCtrl = { $setViewValue: angular.noop }, // nullModelCtrl
- meridians = angular.isDefined($attrs.meridians) ? $scope.$parent.$eval($attrs.meridians) : timepickerConfig.meridians || $locale.DATETIME_FORMATS.AMPMS;
+ meridians = angular.isDefined($attrs.meridians) ? $scope.$parent.$eval($attrs.meridians) : timepickerConfig.meridians || $locale.DATETIME_FORMATS.AMPMS,
+ padHours = angular.isDefined($attrs.padHours) ? $scope.$parent.$eval($attrs.padHours) : true;
$scope.tabindex = angular.isDefined($attrs.tabindex) ? $attrs.tabindex : 0;
$element.removeAttr('tabindex');
@@ -190,12 +191,12 @@ angular.module('ui.bootstrap.timepicker', [])
return seconds >= 0 && seconds < 60 ? seconds : undefined;
}
- function pad(value) {
+ function pad(value, noPad) {
if (value === null) {
return '';
}
- return angular.isDefined(value) && value.toString().length < 2 ?
+ return angular.isDefined(value) && value.toString().length < 2 && !noPad ?
'0' + value : value.toString();
}
@@ -326,7 +327,7 @@ angular.module('ui.bootstrap.timepicker', [])
invalidate(true);
} else if (!$scope.invalidHours && $scope.hours < 10) {
$scope.$apply(function() {
- $scope.hours = pad($scope.hours);
+ $scope.hours = pad($scope.hours, !padHours);
});
}
});
@@ -435,7 +436,7 @@ angular.module('ui.bootstrap.timepicker', [])
hours = hours === 0 || hours === 12 ? 12 : hours % 12; // Convert 24 to 12 hour system
}
- $scope.hours = keyboardChange === 'h' ? hours : pad(hours);
+ $scope.hours = keyboardChange === 'h' ? hours : pad(hours, !padHours);
if (keyboardChange !== 'm') {
$scope.minutes = pad(minutes);
}