title: AngularJS UI Bootstrap popover using ng-repeat data
body: <p>I have an ng-repeat and I need to use the current object in the iteration to create the body of uib-popover content.</p>
  
  <p>I have tried uib-popover-html but I get an angular unsafe context error.  I tried a function that returns an HTML string using $sce but that failed as well.</p>
  
  <p>Is there a way to build the content of a popover message inside an ng-repeat using the current object in the sequence?</p>
  
  <p><strong>Update</strong></p>
  
  <p>@Claies: This is a sample of the code I was trying to use</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>(function () {
      'use strict';
  
      angular.module('myModule').controller('myController', ['$scope', '$sce', myModule])
   
   function myModule($scope, $sce) {
    var vm = this;
    vm.getPopoverData = function(s) {
     return $sce.trustAsHtml('&lt;ul&gt;&lt;li&gt;' + s.Value1 + '&lt;/li&gt;&lt;li&gt;' + s.Value2 + '&lt;/li&gt;&lt;/ul&gt;');
    }
   }
  })();</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div class="col-xs-4" ng-repeat="s in vm.sequences&gt;
   &lt;button uib-popover-html="vm.getPopoverData(s)" popover-trigger="mouseenter" type="button" class="value btn"&gt;s.text&lt;/button&gt;
  &lt;/div&gt;
  &lt;!-- This returns Error: [$rootScope:infdig] 10 $digest() iterations reached. Aborting! Watchers fired in the last 5 iterations --&gt;
  
      &lt;div class="col-xs-4" ng-repeat="s in vm.sequences&gt;
   &lt;button uib-popover-html="'&lt;ul&gt;&lt;li&gt;{{s.value1}}&lt;/li&gt;&lt;li&gt;{{s.value2}}&lt;/li&gt;&lt;/ul&gt;'" popover-trigger="mouseenter" type="button" class="value btn"&gt;s.text&lt;/button&gt;
  &lt;/div&gt;
  &lt;!-- This returns Error: [$sce:unsafe] Attempting to use an unsafe value in a safe context. --&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>Thank you</p>