仅当内容存在时才显示弹出窗口

Question

我的弹出内容是动态生成的。如果只有内容存在，我必须显示 popup/popover。此外，需要在 API 调用后调用此弹出窗口。

<div ng-app="customDirectives">
    <div> <span custom-popover popover-html="Some Popover Text" popover-placement="bottom" popover-label="Label"></span>

    </div>
</div>


customDirectives = angular.module('customDirectives', []);
customDirectives.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
            });
        }
    };
});

angular.module('CustomComponents', ['customDirectives']);

Answer 1

仅当内容可用时才调用 popover()，

    if(attrs.popoverHtml){
      $(el).popover({
          trigger: 'click',
          html: true,
          content: attrs.popoverHtml,
          placement: attrs.popoverPlacement
      });
    }

正如您提到的动态文本，已更新 fiddle 以显示基于动态文本的弹出窗口 http://jsfiddle.net/Vinthi/hthq965t/2/

仅当内容存在时才显示弹出窗口

Show Popup only if content is present

angularjs

angularjs-directive