twitter bootstrap - angularjs: ng-repeat over half the length of an array -
i using ngrepeat angularjs fill out grid in bootstrap. grid needs periodic clearfixes.
so, example, if grid is:
<div class="container"> <div class="row"> <div class="col-md-4 col-sm-6"> foo bar </div> <div class="col-md-4 col-sm-6"> foo bar </div> <div class="clearfix visible-sm-block"></div> <div class="col-md-4 col-sm-6"> foo bar </div> <div class="clearfix visible-md-block"></div> <div class="col-md-4 col-sm-6"> foo bar </div> <div class="clearfix visible-sm-block"></div> <div class="col-md-4 col-sm-6"> foo bar </div> <div class="col-md-4 col-sm-6"> foo bar </div> </div> </div> is accomplishable ngrepeat? seems structure like:
<div class="container"> <div class="row"> <div data-ng-repeat="i in [0,1,2,3,4,5]" class="col-md-4 col-sm-6"> foo bar </div> </div> </div> couldn't clearfixes in there iterator.
angular has index property called $index when you're inside of ng-repeat directive. use display clearfix div when needed. if want shortcut more, use $even or $odd (in case, $odd) property display every 2 instances.
combining special ng-repeat-start , ng-repeat-end directives, @ required result:
<div class="container"> <div class="row"> <div ng-repeat-start="i in [0,1,2,3,4,5]" class="col-md-4 col-sm-6"> foo bar </div> <div ng-repeat-end ng-if="$odd" class="clearfix visible-sm-block"></div> </div> </div> here's plunker show it's working: plunker
Comments
Post a Comment