包含img标记的AngularJS元素的内部高度

时间:2015-01-12 06:13:29

标签: javascript angularjs

我正试图获得包含img标签的AngularJS div的全部高度。由于图像尚未渲染,有时我对el [0] .offsetHeight的调用有效,有时它不会因为假设offsetHeight没有img不起作用。

我有什么选择?

这是我的代码:

angular.module('itemApp').directive('itemRender', ['$timeout', function($timeout) {
    return {
        restrict: 'A',
        templateUrl: 'tmpl/item.html',
        replace: true,
        link: function(scope, el) {
            //turning off angularjs dirty checking
            $timeout(init, 0, true);

            //init
            function init() {
                var arrayOfColumnHeights = scope.itemCtrl.arrayOfItemColumnsHeight;
                var appendToColumn = getShortestColumn(arrayOfColumnHeights);

                el.css({
                    'top': String(arrayOfColumnHeights[appendToColumn]) + 'px',
                    'left': String(appendToColumn * 405) + 'px' //imgs are 400px always
                });

                //this is the problem area; offsetHeight doesn't properly compute all
                //the time if the img hasn't loaded already and many imgs are
                //interlaced in my collection so some get loaded right away and 
                //some don't
                arrayOfColumnHeights[appendToColumn] += el[0].offsetHeight + 10;
            }
        }
    }
}]);

这很简单。我有3列,我正在插入一个项目到最短的列。这就是我所做的一切。我只需要offsetHeight来正确计算,我就已经完成了设置。

0 个答案:

没有答案