Artikel in ng-Wiederholung gequetscht mit flexbox - angular.js/flexbox

Question

Wie kann man einen Container scrollbar machen, wenn der Inhalt mit ng-repeat gefüllt ist, mit flexbox wiederholen.

Das Problem scheint zu sein, dass flexbox keine Höhe auf seine Elemente anwendet.

<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/

In der Geige Sie Artikel, zusammen gequetscht.

Answer 1

Hier können Sie flex-shrink: 0; zu Ihrem .item Element für Browser hinzufügen, die das dynamische Hinzufügen von Elementen innerhalb der Flexbox nicht richtig unterstützen.

So Ihr Code wird:

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