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 ?
+ ''+
+ '
' :
'