Javascript 爆米花不'；t从添加到视图的指令中显示

我想为Bootstrap Popover特性创建一个指令

控制器：

var app = angular.module('firstApp', ['ui.bootstrap']);

app.directive('popover', function() {
   return function(scope, elem) {
      console.log(elem)
      elem.popover({trigger: 'hover','placement': 'left'});
   }
})

 <div class='content' ng-repeat ='item in items'>
     <button type="button" popover class="testBtn btn btn-default" data-container="body" data-toggle="popover" data-content="Vivamus sagittis." title='what?'>
        Popover on left
     </button>
 </div>

HTML:

var app = angular.module('firstApp', ['ui.bootstrap']);

app.directive('popover', function() {
   return function(scope, elem) {
      console.log(elem)
      elem.popover({trigger: 'hover','placement': 'left'});
   }
})

 <div class='content' ng-repeat ='item in items'>
     <button type="button" popover class="testBtn btn btn-default" data-container="body" data-toggle="popover" data-content="Vivamus sagittis." title='what?'>
        Popover on left
     </button>
 </div>

左边的爆米花

---

我在控制台中看不到日志，popover功能也没有按预期工作。

您缺少定义指令的某些方面。尝试以下方法获得一个灵活的popover：

app.directive('popover', 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
            });
        }
    };
});

---

您没有在UI引导弹出窗口的元素上设置正确的属性：

它应该看起来像这样：

<button type="button" class="testBtn btn btn-default" popover="Vivamus sagittis."
popover-trigger="click" popover-title='what?' popover-placement='left'>
   Popover on left
</button>

左边的爆米花

。。您不需要像前面所示定义自己的指令

---

如果您希望创建自己的指令（即不使用UI引导），则需要在代码中显示的内容中添加一些重要的部分。我假设你实际上并不打算这么做，因为你已经将“ui.bootstrap”注入到你的应用程序中，但是，无论如何，这里展示了这可能是如何工作的。

建议在plunker中创建一个演示。可能应该删除bootstrap.js用于自动初始化的数据属性。您可以创建一个指令，该指令只返回与“link”属性相同的函数。也不需要在

$（）

中包装

el

，因为它已经是一个jQlite或jQuery对象（如果jQuery在angular之前加载）