title: AngularJs - UI Bootstrap Popover
body: <p>Hello I'm using UI boostrap within Angular App
  I would like to add Popover using UI boostrap, so this what I did so far:</p>
  
  <pre><code> &lt;a popover popover-template="'tpl.html'" data-img="http://domain.com/img1.jpg" data-title="Link 1 title" data-content = "Link 1 content..."&gt;Link 1&lt;/a&gt;
   &lt;a popover popover-template="'tpl.html'" data-img="http://domain.com/img2.jpg" data-title="Link 2 title" data-content = "Link 2 content..."&gt;Link 2&lt;/a&gt;
   ...
   &lt;a popover popover-template="'tpl.html'" data-img="http://domain.com/imgn.jpg" data-title="Link n title" data-content = "Link n content..."&gt;Link n&lt;/a&gt;
  </code></pre>
  
  <p>And then inject attributes : <code>data-img</code>, <code>data-title</code>, <code>data-content</code> in this template <code>tpl.html</code>:</p>
  
  <pre><code> &lt;div class="popover-content"&gt;
   &lt;md-card&gt;
      &lt;img ng-src="{{$img}}" class="md-card-image" &gt;
      &lt;md-card-title&gt;
        &lt;md-card-title-text&gt;
          &lt;span class="md-headline"&gt;{{ $title}}&lt;/span&gt;
        &lt;/md-card-title-text&gt;
      &lt;/md-card-title&gt;
      &lt;md-card-content&gt;
      {{ $content }}
      &lt;/md-card-content&gt;
    &lt;/md-card&gt;
  &lt;/div&gt; 
  </code></pre>
  
  <p>Of course it doesn't work :)</p>
  
  <p>My question is : how to inject element <code>a</code> attributes in the template <code>tpl.html</code>?</p>
  
  <p>Please, any help is appreciated </p>