フレックスボックスでng-repeatで絞り込まれたアイテム - angular.js/flexbox

Question

フレックスボックスを使用してコンテンツがng-repeatで満たされている場合、コンテナをスクロール可能にする方法。

問題は、flexboxがその要素に高さを適用していないように見えます。あなたはアイテムが一緒に圧迫見るフィドルで

<div ng-app> 
    <div ng-controller="Ctrl"> 
    <div class='container'> 
     <div class='item' ng-repeat="item in items"> 
     <div class='item-inner'>{{item.text}}</div> 
     </div> 
    </div> 
    </div> 
</div> 

http://jsfiddle.net/5eg2zn2d/

。

Answer 1

フレックスボックス内の要素の動的追加を適切にサポートしていないブラウザでは、.item要素にflex-shrink: 0;を追加できます。

だからあなたのコードは次のようになります。

.item { 
    display: flex; 
    margin: 3px; 
    flex-shrink: 0; 
}