有關ng-repeat圖像的指令只能提取關於第一個圖像的信息

Question

我的意圖是根據高度和寬度動態添加一個類，以便它適合div的內部。這裏的指令是拉高度和寬度，然後添加類。我遇到的問題是，它需要第一個圖像的信息，並使用該數據爲所有其他圖像添加類。所以即使需要'風景圖像'，所有圖像都會返回'肖像圖像'。

這裏是我的指令

function dynamicImageDirective(){ 
    return { 
     restrict: 'A', 
     link: function(scope, elem, attr) { 
      elem.on('load', function() { 
       setTimeout(function(){ 
        var w = $(this).width(), 
         h = $(this).height(); 
        if (w > h) { 
         elem.addClass('landscape-image'); 
        } else { 
         elem.addClass('portrait-image'); 
        } 
       },0); 
      }); 
     } 
    }; 
} 

和重複：

<div class="fullWidth" ng-repeat="gallery in public.galleries"> 
    <div class="col-xs-12 col-sm-12 col-md-6 col-lg-6 col-xl-6 right"> 
     <div class="fullWidth display-inlineBlock verticalCenterDiv" style="height: 325px; padding: 0px;"> 
      <span class="helper"></span> 
      <img ng-click="openLightboxModal($index)" class="vertical-middle" number="{{$index}}" ng-show="gallery.image_url" ng-src="{{gallery.image_url}}" dynamic-image="gallery"> 
     </div> 
    </div> 
</div> 

Answer 1

我能得到它，改成「綁定」而不是「負荷」工作。

function dynamicImageDirective(){ 
    return { 
     restrict: 'A', 
     link: function(scope, elem, attr) { 
      elem.bind('load', function() { 
       var w = this.width; 
       var h = this.height; 
       if (w > h) { 
        $(this).addClass('landscape-image'); 
       } else { 
        $(this).addClass('portrait-image'); 
       } 
      }); 
      elem.bind('error', function(){ 

      }); 
     } 
    } 
}