Meteor - "each" listing in view - html

Question

I have this part of code:
{{#each cards}}
<div class="row-fluid">
<div class="card span4">
<p>{{content}}</p>
</div>
</div>
{{/each}}
and issue with setting it up to do something like this:
<div class="row-fluid">
<div class="card span4">
<p>{{content}}</p>
</div>
<div class="card span4">
<p>{{content}}</p>
</div>
<div class="card span4">
<p>{{content}}</p>
</div>
</div>
<div class="row-fluid">
<div class="card span4">
<p>{{content}}</p>
</div>
....
Anyone have any idea how to do so? (I know that I can render directly from Meteor.render() but I want to avoid it if possible)

Answer 1

Try out this split helper function which will split an array into sub-arrays, each with up to n elements:
if (Meteor.isClient) {
Handlebars.registerHelper("split", function(array, n) {
var groups = _.groupBy(array, function(element, index) {
return Math.floor(index/n);
});
return _.toArray(groups);
});
}
{{#each split cards 3}}
<div class="row-fluid">
{{#each this}}
<div class="card span4">
<p>{{content}}</p>
</div>
{{/each}}
</div>
{{/each}}
Note that your cards helper function must return an array for this to work, not a collection cursor.