Ui-bootstrap 0.13 - How to use tooltip-html inside ng-repeat

trying to switch from tooltip-html-unsafe to tooltip-html because the previous one is deprecated in ui-bootstrap 0.13.0

in this example the content of tooltip-html is exposed in the controller as

<a href="#" tooltip-html="htmlTooltip">Check me out!</a>

$scope.htmlTooltip = $sce.trustAsHtml('I\'ve been made <b>bold</b>!')

      

is there a correct solution when the content is inside ng-repeat? just switching to tooltip-html throws $ parse error

EDIT / SOLUTION:

Actually, I got around it by just adding single quotes, like this:

tooltip-html="'Line 1<br>Line <strong>2</strong>'"

      

I think when the html is more complex you need to use Shawn's answer below

+3


source to share


1 answer


Use the template-template directive.

controller:

$scope.fruits=["Bananas","Apples","Oranges"]

      



HTML:

<div ng-repeat="fruit in fruits">
    <div tooltip-template="'myTooltipTemplate.html'">TOOLTIP</div>
</div>

<script type="text/ng-template" id="myTooltipTemplate.html">
     <b>Fruit</b> : {{fruit}}
</script>

      

plunkr link: http://plnkr.co/edit/yUPl6hCACHKzvCBwrDUf?p=preview

+1


source







All Articles