angualr js - 一度オーバーフローした画像の表示を停止する

Question

私は、mvcファイルの結果と角度ng-srcを使って、ページ上に（他の場所にホスティングしている外部ソースから）画像を提供しています。

例えば、この場合

<div ng=repeat="img in Images"> 
     <img ng-src={{img.path}} style="height:100px;width:auto" /> 
</div>` 

私はimg.pathは常に外部のC＃MVCに行くと、コンテンツへのファイルストリームを返していることを知っています。

私は、スクリーン上に特定の「合計」幅の画像を収めたいと思っています。そのため、親のdivで「オーバーフロー：隠し」を使用する場合など、画像の半分が表示されません。

ng-repeatを設定して、次のイメージがオーバーフローする（オーバーフローするのを防ぐ）方法がありますか？画像のサイズが変更され、高さが100ピクセルに設定され、このサイズに合わせて幅が比例的に拡大されます。画像位置をテストし、答えは別のdivの内側に巣をイメージした

App.directive('styleParent', function() { 
    return { 
     restrict: 'A', 
     link: function (scope, elem, attr) { 
      elem.on('load', function() { 
       var w = $(this).width(), 
        h = $(this).height(); 

       var xPos = angular.element(this).prop('offsetLeft'); 
       xPos += w; 

       var div = elem.parent(); 
       var d_width = div.width(); 
       var d_xPos = angular.element(div).prop('offsetLeft'); 
       d_xPos += d_width; 

       console.log([xPos, d_xPos, this]) 
       if (xPos > d_xPos) { 
        angular.element(this).hide(); 
       } 


      }); 
     } 
    }; 
}); 

Answer 1

.. `

は、私は以下のディレクティブは、トリックを行うだろうと思ったが、それは何らかの理由で画像を再スケールするようです元のdivを先に指定してから、画像そのものではなく画像の親divを非表示にします。