Javascript 获取使用ng repeat生成的img标记的高度

我有一个旋转木马谁的图像正在创建一个ng重复。这些img标签的宽度已设置为100%；和高度，自动。既然在调整窗口大小时该值会发生变化，那么如何以编程方式获取img标记的高度？我试过了

$('#home-carousel img').load(function(){
    console.log($(this).height());
})

但它不起作用，因为IMG当时不存在。 以下是我正在使用的代码：

<div style="position:absolute; top:0px; z-index:-1" id="home-carousel" class="carousel slide" data-ride="carousel">

  <!-- Here's where the problem is -->
  <div class="carousel-inner" role="listbox">
    <div ng-repeat="slide in slides track by $index" class="item" ng-class="{active: $index == 0 }">
      <img src="{{slide.imgUrl}}">
    </div>
  </div>

编辑：好的，让我详细说明一下。这就是我想要实现的目标： 因此，油漆桶的图像应该与此图像中的外观完全一致；位于背景图像结束处的底部

问题是，由于图像的宽度是100%，当窗口调整大小时，就会发生这种情况。因此，我要做的是获取转盘中img图像的高度，并根据该高度定位油漆桶，请查看。

---

另外，在快速搜索之后，我发现了-您可能会发现它很有用。

好的，所以我这样做解决了这个问题： 首先，我使用@Braden1996’s来获取img标签首次加载时的初始高度

<div style="position:absolute; top:0px; z-index:-1" id="home-carousel" class="carousel slide" data-ride="carousel">

  <!-- Wrapper for slides -->
  <div class="carousel-inner" role="listbox">
    <div ng-repeat="slide in slides track by $index" class="item" ng-class="{active: $index == 0 }">
      <img ng-src="{{slide.imgUrl}}" imageonload="imageLoaded()"><!--here-->
    </div>
  </div>
</div>

之后，每次调整窗口大小时，都会更改油漆桶的位置

$(window).resize(function(){
  $('.grid-container').css('margin-top',$('#home-carousel').height()-100 );
})

---

注意：

-100

是这样的，桶不会正好落在背景图像下

您想在何时何地获取和使用高度？你能用你的代码片段创建一个提琴或其他东西吗？提供提琴，这样我们可以帮助你了解ng src技巧。虽然不能解决这个问题，但它比使用src要好。另外一个链接也非常有用。我一直想知道如何检测图像是否已完全加载。再次感谢

$(window).resize(function(){
  $('.grid-container').css('margin-top',$('#home-carousel').height()-100 );
})