Angularjs ui bootstrap - put html inside popover

Question

I'm using official angular bootstrap directives .

I want to use of of it's popovers .

In the documentation it says that if you want to insert html inside the popover you should use popover-html, like bellow :

     <button popover-html="{{getTag()}}" type="button" class="btn btn-default">Dynamic Popover</button>
     <button popover-html="<a>Just fucin show me !</a>" type="button" class="btn btn-default">Click me </button>

But this will raise the following console error :

Error: [$parse:syntax] Syntax Error: Token '<' not a primary expression at column 1 of the expression [sdfsdfsdf] starting at [sdfsdfsdf]. http://errors.angularjs.org/1.4.3/$parse/syntax?p0=%3C&p1=not%20a%20primary%20expression&p2=1&p3=%3Ca%3Esdfsdfsdf%3C%2Fa%3E&p4=%3Ca%3Esdfsdfsdf%3C%2Fa%3E

You can see the plunker

Thanks

michelem · Accepted Answer · 2015-08-12 13:44:24Z

1

Just remove the brackets and the $compile function:

HTML:

<button popover-html="getTag()" type="button" class="btn btn-default">Dynamic Popover</button>

JS:

$scope.getTag = function(){
   return '<a>sdfsdfsdf</a>';
}

answered Aug 12, 2015 at 13:44

michelem

14.6k5 gold badges55 silver badges67 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Angularjs ui bootstrap - put html inside popover

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related