Question

我正在尝试创建自定义工具提示元素。我需要新创建的工具提示元素的高度和宽度。我总是将offsetHeight和offsetWidth设为0。

    var tooltip = angular.element('<div ng-style="tooltipStyle"><div class="ng-tooltip-arrow"></div>\n{{content}}</div>');
    tooltip.attr({
          'class': 'ng-tooltip ' + scope.theme + ' ' + scope.direction
    });
    var tooltipElem = $compile(tooltip)(scope);
    var height = tooltipElem[0].offsetHeight;    <!-- This is always 0 -->
    element.hover(function () {
        element.after(tooltipElem);
    }, function () {
        tooltipElem.remove();
    });

Answer 1

非常棘手，但有可能！

编译后，再次围绕角度元素包裹它：

    var $tooltipElem = angular.element(tooltipElem)[0];

然后获得高度和宽度：

    var height = $tooltipElem.clientHeight;
    var width  = $tooltipElem.clientWidth;

顺便说一下，最后，如果你想设置工具提示位置，你可以这样做：

    tooltipElem.css({
           top: top+'px',
           left: left+'px'
    });

完整的工作示例：https://codepen.io/vsmori/pen/GORZdQ

如何在angular指令中找到新创建元素的高度和宽度

1 个答案: