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

时间:2018-03-19 16:45:52

标签: angularjs angularjs-directive

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

http://jsfiddle.net/ivankovachev/U4GLT/

<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']);

1 个答案:

答案 0 :(得分:0)

仅在内容可用时调用popover(),

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

正如您提到的动态文本,已根据动态文本更新了小提示以显示弹出窗口 http://jsfiddle.net/Vinthi/hthq965t/2/