diff --git a/src/timepicker/test/timepicker.spec.js b/src/timepicker/test/timepicker.spec.js
index a23ca5ce33..cc07494640 100644
--- a/src/timepicker/test/timepicker.spec.js
+++ b/src/timepicker/test/timepicker.spec.js
@@ -1077,6 +1077,28 @@ describe('timepicker directive', function() {
     });
   });
 
+  describe('setting uibTimepickerConfig tmeplate url', function() {
+    var originalConfig = {};
+    var newTemplateUrl = 'foo/bar.html';
+    beforeEach(inject(function(_$compile_, _$rootScope_, uibTimepickerConfig) {
+      angular.extend(originalConfig, uibTimepickerConfig);
+      $templateCache.put(newTemplateUrl, '<div>baz</div>');
+      uibTimepickerConfig.templateUrl = newTemplateUrl;
+
+      element = $compile('<uib-timepicker ng-model="time"></uib-timepicker>')($rootScope);
+      $rootScope.$digest();
+    }));
+    afterEach(inject(function(uibTimepickerConfig) {
+      // return it to the original state
+      angular.extend(uibTimepickerConfig, originalConfig);
+    }));
+
+    it('should use a custom template', function() {
+      expect(element[0].tagName.toLowerCase()).toBe('div');
+      expect(element.html()).toBe('baz');
+    });
+  });
+
   describe('$formatter', function() {
     var ngModel,
       date;
diff --git a/src/timepicker/timepicker.js b/src/timepicker/timepicker.js
index 5c073a62cf..a2544413a5 100644
--- a/src/timepicker/timepicker.js
+++ b/src/timepicker/timepicker.js
@@ -10,7 +10,8 @@ angular.module('ui.bootstrap.timepicker', [])
   readonlyInput: false,
   mousewheel: true,
   arrowkeys: true,
-  showSpinners: true
+  showSpinners: true,
+  templateUrl: 'uib/template/timepicker/timepicker.html'
 })
 
 .controller('UibTimepickerController', ['$scope', '$element', '$attrs', '$parse', '$log', '$locale', 'uibTimepickerConfig', function($scope, $element, $attrs, $parse, $log, $locale, timepickerConfig) {
@@ -519,7 +520,7 @@ angular.module('ui.bootstrap.timepicker', [])
   };
 }])
 
-.directive('uibTimepicker', function() {
+.directive('uibTimepicker', function(uibTimepickerConfig) {
   return {
     require: ['uibTimepicker', '?^ngModel'],
     controller: 'UibTimepickerController',
@@ -527,7 +528,7 @@ angular.module('ui.bootstrap.timepicker', [])
     replace: true,
     scope: {},
     templateUrl: function(element, attrs) {
-      return attrs.templateUrl || 'uib/template/timepicker/timepicker.html';
+      return attrs.templateUrl || uibTimepickerConfig.templateUrl;
     },
     link: function(scope, element, attrs, ctrls) {
       var timepickerCtrl = ctrls[0], ngModelCtrl = ctrls[1];