Angular Bootstrap popover只能运行一次

Question

我有一个弹出窗口，它在我第一次使用时工作正常但是，它就像它需要再次$compile一样。我被困了，我不知道该怎么做。在第一次正常工作之后，然后尝试单击弹出窗口内的按钮完全没有效果。

我的HTML：

<button blockpopover templatepk="template.pk" class="btn">
    Add block
</button>

popovertemplate html：

<div id="popoverblock">
    <button class="btn" ng-click="createBlock('Basic');">Basic</button>
</div>

使用createBlock()调用的代码执行得很好并且返回时没有错误。 （创建了一个对象块）

我的指示：

app.directive('blockpopover', function ($templateCache) {

    var getTemplate = function (contentType) {
        var template = '';
        switch (contentType) {
            case 'createBlock':
                template = $templateCache.get("templatePopoverBlock.html");
                break;
        }
        return template;
    }
    return {
        scope:{'templatepk': '='},
        restrict: "A",
        controller: function($scope, $element, $compile, $timeout){
            $scope.createBlock = function (type) {
                var type = type;
                $scope.$parent.createBlock($scope.templatepk, type);
                // use the parent scope function
            };
            var popOverContent;
            content = getTemplate("createBlock");
            popOverContent = $compile(content)($scope);
            var options = {
                trigger: 'focus',
                content: popOverContent,
                placement: "bottom",
                html: true,
            };
            $element.popover(options);
        }
     };
});