ng-click is not working in ui-bootstrap popover

Question

     <div ng-repeat = "offer in productOffers">
       <div class = "col-md-12 col-xs-12 text-left mrg-5 selr-name"
         uib-popover-html = 
          "'<img src=assets/images/cart-blue.png 
            class=img-cart 
            ng-click=addProductToCart(offer,finalProduct)/> 

            <div class=fonts-13  
            ng-click=addProductToCart(offer,finalProduct)> 
            Add To Cart
           </div>'">
       </div>
   </div>

Here, I have added my code, I want to use ng-click inside popover element and I have ng-repeat for popover, so neeed to add popover HTML inline. ng-click is not working inside popover.

Plunker Link

Thanks in advance. Any help on this highly appreciated.

Answer 1

Use uib-popover-template insted of uib-popover-html. working plucker link

<div ng-repeat = "offer in productOffers">
  <div class = "col-md-12 col-xs-12 text-left mrg-5 selr-name"
     uib-popover-template= 
      "'tpl.html'">
</div> 
<script type="text/ng-template" id="tpl.html">
   <img src="assets/images/cart-blue.png" 
        class="img-cart" 
        ng-click="addProductToCart(offer,finalProduct)"/> 

        <div class="fonts-13"  
        ng-click="addProductToCart(offer,finalProduct)"> 
        Add To Cart
       </div>
</script>