From 1f65d87fc3c8bb30c4f579ea492778e987b84236 Mon Sep 17 00:00:00 2001 From: Filip Sobczak Date: Wed, 14 Oct 2015 18:56:39 +0100 Subject: [PATCH] feat(datepicker): add templateUrl support for pickers - Add support for custom template urls for `uibDaypicker`, `uibMonthpicker`, and `uibYearpicker` Closes #4432 --- src/datepicker/datepicker.js | 14 ++++++++++---- src/datepicker/test/datepicker.spec.js | 19 +++++++++++++++++++ 2 files changed, 29 insertions(+), 4 deletions(-) diff --git a/src/datepicker/datepicker.js b/src/datepicker/datepicker.js index 6891b50645..f5f2636537 100644 --- a/src/datepicker/datepicker.js +++ b/src/datepicker/datepicker.js @@ -458,7 +458,9 @@ angular.module('ui.bootstrap.datepicker', ['ui.bootstrap.dateparser', 'ui.bootst .directive('uibDaypicker', function() { return { replace: true, - templateUrl: 'template/datepicker/day.html', + templateUrl: function(element, attrs) { + return attrs.templateUrl || 'template/datepicker/day.html'; + }, require: ['^?uibDatepicker', 'uibDaypicker', '^?datepicker'], controller: 'UibDaypickerController', link: function(scope, element, attrs, ctrls) { @@ -473,7 +475,9 @@ angular.module('ui.bootstrap.datepicker', ['ui.bootstrap.dateparser', 'ui.bootst .directive('uibMonthpicker', function() { return { replace: true, - templateUrl: 'template/datepicker/month.html', + templateUrl: function(element, attrs) { + return attrs.templateUrl || 'template/datepicker/month.html'; + }, require: ['^?uibDatepicker', 'uibMonthpicker', '^?datepicker'], controller: 'UibMonthpickerController', link: function(scope, element, attrs, ctrls) { @@ -488,7 +492,9 @@ angular.module('ui.bootstrap.datepicker', ['ui.bootstrap.dateparser', 'ui.bootst .directive('uibYearpicker', function() { return { replace: true, - templateUrl: 'template/datepicker/year.html', + templateUrl: function(element, attrs) { + return attrs.templateUrl || 'template/datepicker/year.html'; + }, require: ['^?uibDatepicker', 'uibYearpicker', '^?datepicker'], controller: 'UibYearpickerController', link: function(scope, element, attrs, ctrls) { @@ -1034,7 +1040,7 @@ angular.module('ui.bootstrap.datepicker') var focusElement = function() { self.element[0].focus(); }; - + $scope.$on('uib:datepicker.focus', focusElement); $scope.keydown = function(evt) { diff --git a/src/datepicker/test/datepicker.spec.js b/src/datepicker/test/datepicker.spec.js index 7fce2492b6..39f9c49a42 100644 --- a/src/datepicker/test/datepicker.spec.js +++ b/src/datepicker/test/datepicker.spec.js @@ -362,6 +362,25 @@ describe('datepicker directive', function() { expect(element.html()).toBe('baz'); }); + it('should support custom day, month and year templates', function() { + $templateCache.put('foo/day.html', '
day
'); + $templateCache.put('foo/month.html', '
month
'); + $templateCache.put('foo/year.html', '
year
'); + + $templateCache.put('foo/bar.html', '
' + + '' + + '' + + '' + + '
'); + + element = $compile('')($rootScope); + $rootScope.$digest(); + + var expectedHtml = '
day
month
year
'; + + expect(element.html()).toBe(expectedHtml); + }); + it('should expose the controller in the template', function() { $templateCache.put('template/datepicker/datepicker.html', '
{{datepicker.text}}
');