Директивы Angularjs, не привязанные к DOM

Question

Im борется, чтобы остричь голову.

У меня есть директива, которая открывается при нажатии кнопки при нажатии на изображение. Это все работает так, как ожидалось, но нажатие на кнопку не вызывает щелчок мышью. Я ожидаю, что он щелкнет, что заставляет меня думать, что он не привязан к DOM.

Вот мой код, надеюсь, что кто-то может пролить свет на это.

<img src="img.png" alt="" custom-popover 
     popover-html="<button ng-click='func()'> 
      Click here</button>" popover-placement="bottom" popover-label="Label"/> 

А вот моя директива Im пытается использовать

app.directive('customPopover', function() { 
     return { 
      restrict: 'A', 
      template: '<span>{{label}}</span>',  
      link: function (scope, el, attrs) {   
       scope.label = attrs.popoverLabel; 
       $(el).popover({ 
        trigger: 'click', 
        html: true, 
        content: attrs.popoverHtml, 
        placement: attrs.popoverPlacement 
       }); 
      } 
     }; 
    }); 

Answer 1

попробовать нечто вроде этого - я не гарантирую, что это будет работать, так как я не могу проверить это.

app.directive('customPopover', function ($compile) { 
    return { 
     restrict: 'A', 
     template: '<span>{{label}}</span>',  
     link: function (scope, el, attrs) {   
      scope.label = attrs.popoverLabel; 
      $(el).popover({ 
       trigger: 'click', 
       html: true, 
       content: $scompile(attrs.popoverHtml)(scope), 
       placement: attrs.popoverPlacement 
      }); 
     } 
    }; 
});