angularjs如何找到img元素的高度和宽度

Posted

技术标签:

【中文标题】angularjs如何找到img元素的高度和宽度【英文标题】:angularjs how to find img element height and width 【发布时间】:2014-01-03 08:09:16 【问题描述】:

您好,我正在尝试查找图像元素的高度和宽度以调整其大小。但是每次我使用 elem.height() 或 elem.width() 我得到 0?

html

<div>
    <img data-ng-src="photosrc" lightbox-resize-image>
</div>

directive.js

.directive('lightboxResizeImage', function() 
return 
    restrict: 'A',
    link: function(scope, elem, attrs) 

        console.log(elem.parent().width()); //==equals 575
        console.log(elem.width()); //this always equals 0

  
  );

【问题讨论】:

确保先加载图片。 elem.on('load', function()console.log($(this).width())) 我建议只在确保它没有宽度之后才执行上述操作。缓存的图像可能已经触发了该事件。 【参考方案1】:

见下面的代码:

.directive('lightboxResizeImage', function() 
    return 
        restrict: 'A',
        link: function(scope, elem, attrs) 
             console.log(elem.parent().width()); // =575
             console.log(elem[0].offsetHeight);
        
    
);

【讨论】:

以上是关于angularjs如何找到img元素的高度和宽度的主要内容,如果未能解决你的问题,请参考以下文章

如何确定 IE 中动态加载图像的 img 宽度/高度?

jquery如何获得宽度为百分比的元素的宽度?

如何让一个元素高度随宽度按比例自适应

指令容器的高度为 0px,宽度为 0px - angularjs

如何让div自动适应自身的img高度

怎么js设置Img的宽度,和高度