Create Row Every After 2 Item In Angular Ng-repeat - Ionic Grid
Answer :
I managed to do it using $even
.
<div ng-repeat="number in numbers">
<div class="row" ng-if="$even">
<div class="col col-50">{{numbers[$index]}}</div>
<div class="col col-50">{{numbers[$index + 1]}}</div>
</div>
</div>
Here's a working JSFiddle.
The solution from @Patrick Reck is excellent, but it forces you to repeat your code twice,
I suggest this improvement:
<div ng-repeat="number in numbers">
<div class="row" ng-if="$even">
<div class="col col-50"
ng-repeat="num in [numbers[$index],numbers[$index + 1]]">
{{num}}
</div>
</div>
</div>
this way you will write your code one time as if it is a normal ng-repeat
You can add flex-wrap: wrap to class row
http://jsfiddle.net/0momap0n/99/
<div ng-controller="MyCtrl">
<div class="row" style="flex-wrap: wrap">
<div class="col col-50" ng-repeat="number in numbers">{{number}}</div>
</div>
var myApp = angular.module('myApp',[]);
function MyCtrl($scope) {
$scope.numbers = [1, 2, 3, 4, 5, 6];
}
Comments
Post a Comment