Erhalten Sie ng-repeat Daten in 4 Spalten

Question

Ich erhalte eine Liste der Daten von Db zu einer Ansicht mit ng-repeat. Um mehrere Werte gleichzeitig auszuwählen, verwende ich das Checklistenmodell. Mein Code ist wie folgt,

<div ng-repeat="item in items"> 
<input type=checkbox checklist-model="user.role" checklist-value="item"/>{{item}} 
</div> 

Dies wird eine lange Liste untereinander zurückgeben. Was ich brauche, ist, dass diese Daten in der Liste in 4 Spalten angezeigt werden. Jede Hilfe bitte!

Answer 1

Working Demo

Dies ist, was Sie suchen. Hoffe, dass Sie Ihr Problem lösen.

<div ng-repeat="product in products" ng-if="$index % 3 == 0" class="row"> 
    <div class="col-xs-4"> <input type="checkbox" checklist-model="user.role" checklist-value="{{products[$index]}}"/>{{products[$index]}}</div> 
    <div class="col-xs-4"> <input type="checkbox" checklist-model="user.role" checklist-value="{{products[$index]}}"/>{{products[$index+1]}}</div> 
    <div class="col-xs-4"> <input type="checkbox" checklist-model="user.role" checklist-value="{{products[$index]}}"/>{{products[$index+2]}}</div> 
</div> 

Ausgang:

Answer 2

Sie Anzeige verwenden: inline-block auf Elemente, die Sie in einer Reihe möchten. Wie du sie in dieser Reihe auslegst, kann je nach dem, was du suchst, auf verschiedene Arten geschehen.

<div ng-repeat="item in items" style="display:inline-block;"> 
    <input type=checkbox checklist-model="user.role" checklist-value="item"/>{{item}} 
</div>