javascript - Angular ng-show 回调

Question

我正在尝试获取当鼠标悬停在按钮上时出现的元素的高度。

示例代码:

<div ng-mouseenter="mouseoverPopUp()" ng-mouseleave="showpop=false">menu</div>
<div class="popover" ng-show="showpop">{{content}}</div>

$scope.mouseoverPopUp = function($event){
    $scope.showpop = true;
    var height = angular.element(".popover").innerHeight();
};

问题是有时元素的高度在它出现之前就被获取了。无论如何，我只能在 ng-show 显示元素的情况下运行代码吗？我需要在它出现后尽快获取高度来调整元素的位置。

Answer 1

您是否尝试过在 $timeout 调用中使用您的代码，以便在 Angular 完成工作后延迟 JS 的执行？

$scope.mouseover = function($event){
    $timeout(function() {
        var height = angular.element(".popover").innerHeight();
    });
};

你如何展示你的弹出窗口？带有CSS过渡？如果是这样，您将需要相应地延迟您的 JS 代码检索高度。或者您可以使用 Angular-animate 来绑定(bind)具有更多逻辑的事件

ps:为了帮助更多，jsfiddle 会很棒