Angularjs рендеринг директива с transclude на теле

Question

Я хочу создать директиву атрибута всплывающей подсказки с помощью transclude и отобразить ее на теле ..

, например:

<div tooltip>
    <transcluded-content>content</transcluded-content>
</div>

module.directive('tooltip', function () {
    return {
            restrict: 'A',
            templateUrl: 'tooltip.html',
            transclude: {
                'transcluded-content': 'transcluded-content'
            }
        };
    });

Вместо этого я хочу отобразить шаблон на теледив ...

Answer 1

Чтобы элемент был на теле, вы можете попробовать переместить его в функцию ссылки.Как насчет этого?

module.directive('tooltip', function () {
    return {
            restrict: 'A',
            templateUrl: 'tooltip.html',
            transclude: {
                'transcluded-content': 'transcluded-content'
            },
            link: function (scope, element) {
                angular.element('body').append(element);
            }
        };
    });

Существуют более сложные подходы, но они потребуют $compile и других беспорядочных методов.