Question

我有以下指令，它应该调整div的大小以占用它可以达到的最大高度。

指令：

return {
    restrict: 'A',

    link: function (scope, elem, attrs) {
        scope.onResize = function () {
            var parent = $("#" + elem.parent()[0].id);
            var parentMargins = parent.outerHeight(true) - parent.height();
            var height = $window.innerHeight - elem[0].offsetTop - parentMargins ;
            elem.css('height', height + 'px');
        }
        scope.onResize();

        angular.element($window).bind('resize', function () {
            scope.onResize();
            scope.$apply();
        })
    }
};

HTML：

<div style="margin-bottom: 10px;">
    <div resize-me>
        <div ng-repeat="c in contacts">
            ...some html to render contacts
        </div>
    </div>
</div>

我遇到的问题是，当视图最初加载时，高度是偏离的。如果我调整浏览器的大小，一切正常。

有关如何正确呈现或改进此指令的任何建议都会很棒。

更新：问题似乎与offsetTop有关。我第一次加载页面时得到以下值。

elem [0] .offsetTop = 98

$（＆＃34; #dataList＆＃34;）。offset（）。top = 158

使用jQuery我得到正确的偏移，但为什么？有没有办法在不使用jQuery的情况下获得正确的偏移量？

Angular Directive在负载时没有正确调整Div的大小

0 个答案: