diff --git a/src/popover/popover.js b/src/popover/popover.js index 2bea0a3e10..bcaabbe5a8 100644 --- a/src/popover/popover.js +++ b/src/popover/popover.js @@ -14,6 +14,19 @@ angular.module( 'ui.bootstrap.popover', [ 'ui.bootstrap.tooltip' ] ) }; }) +.directive( 'popoverHtmlPopup', function () { + return { + restrict: 'EA', + replace: true, + scope: { title: '@', content: '=', placement: '@', animation: '&', isOpen: '&' }, + templateUrl: 'template/popover/popover-html.html' + }; +}) + .directive( 'popover', [ '$tooltip', function ( $tooltip ) { return $tooltip( 'popover', 'popover', 'click' ); +}]) + +.directive( 'popoverHtml', [ '$tooltip', function ( $tooltip ) { + return $tooltip( 'popoverHtml', 'popoverHtml', 'click', true ); }]); diff --git a/src/popover/test/popover.spec.js b/src/popover/test/popover.spec.js index 7e6f2b3970..2bc6fa78df 100644 --- a/src/popover/test/popover.spec.js +++ b/src/popover/test/popover.spec.js @@ -68,4 +68,37 @@ describe('popover', function() { })); }); +describe('popoverHtml', function() { + var elm, + elmBody, + scope, + elmScope; + + // load the popover code + beforeEach(module('ui.bootstrap.popover')); + + // load the template + beforeEach(module('template/popover/popover-html.html')); + + beforeEach(inject(function($rootScope, $compile) { + elmBody = angular.element( + '
Selector Text
' + ); + + scope = $rootScope; + scope.html = '
foo
'; + $compile(elmBody)(scope); + scope.$digest(); + elm = elmBody.find('span'); + elmScope = elm.scope(); + })); + + it('should render properly', inject(function() { + // We can only test *that* the popover-html-popup element was created as the + // implementation is templated and replaced. + expect( elmBody.children().length ).toBe( 1 ); + })); +}); + + diff --git a/src/tooltip/tooltip.js b/src/tooltip/tooltip.js index 57c9cf09ee..0e858d7ea5 100644 --- a/src/tooltip/tooltip.js +++ b/src/tooltip/tooltip.js @@ -65,7 +65,7 @@ angular.module( 'ui.bootstrap.tooltip', [ 'ui.bootstrap.position', 'ui.bootstrap * TODO support multiple triggers */ this.$get = [ '$window', '$compile', '$timeout', '$parse', '$document', '$position', '$interpolate', function ( $window, $compile, $timeout, $parse, $document, $position, $interpolate ) { - return function $tooltip ( type, prefix, defaultTriggerShow ) { + return function $tooltip ( type, prefix, defaultTriggerShow, bindHtml ) { var options = angular.extend( {}, defaultOptions, globalOptions ); /** @@ -95,7 +95,15 @@ angular.module( 'ui.bootstrap.tooltip', [ 'ui.bootstrap.position', 'ui.bootstrap var startSym = $interpolate.startSymbol(); var endSym = $interpolate.endSymbol(); - var template = + var template = bindHtml ? + '
'+ + '
' : '
+
+ +
+

+
+
+