How to render two column grid with Ember and Htmlbars

1

I need to render such html code:

<div class="grid">
  <div class="row-fluid">
    <div class="span4">Item #1 (row #1 / column #1)</div>
    <div class="span4">Item #2 (row #1 / column #2)</div>
    <div class="span4">Item #3 (row #1 / column #3)</div>
  </div>
  <div class="row-fluid">
    <div class="span4">Item #4 (row #2 / column #1)</div>
    <div class="span4">Item #5 (row #2 / column #2)</div>
    <div class="span4">Item #6 (row #2 / column #3)</div>
  </div>
</div>

But I don’t know how I can do it with foreach.

I’m find the solution on stackoverflow How to render a (Twitter Bootstrap) grid using Ember.js and Handlebars.js? - Stack Overflow. But is that the best solution?

2

I would do like this: JS Bin - Collaborative JavaScript Debugging

3

It’s look like good, but you have model in such format:

[[item1, item2, item3], [item4, item5, item6]]

And I have model in another format:

[item1, item2, item3, item4, item5, item6]
4

You can transform your model so it looks like a table… Some solutions are here javascript - Convert simple array into two-dimensional array (matrix) - Stack Overflow