Emberjs CollectionView array in an array - ember.js

Question

Hi I would like to know if it was possible to use a more complex array for the collectionView.
Because for now I'm only using it like this :
App.GroupList = Ember.ArrayController.create({
content: ['A','B','C','D'],
})
App.GroupListView = Ember.CollectionView.extend({
tagName: 'tbody',
contentBinding: "App.GroupList"
})
And display them like this :
<table class="table-history">
{{#collection App.GroupListView}}
<td class="col-left">
{{view.content}}
</td>
<td>
<span class="col-number-contact">0</td>
</td>
<td>
<div class="ph-img"></div>
</td>
<td>
<div class="ed-img"></div>
</td>
{{/collection}}
</table>
So far, so good, its working well, but I would like to add more information inside the content like this :
content: [
['A','1'],
['B','2'],
['C','3'],
]
And display the number in a second <td> tad (the one with the 0 inside).
But its not working.. and I wouldn't even know how to display them in my template.
Someone already managed to passe a complex collection content ?

Answer 1

You can use an array of objects instead like this:
App.GroupList = Ember.ArrayController.create({
content: [{'id':1,val:'A'},{'id':2,val:'B'},{'id':3,val:'C'},{'id':4,val:'D'}];
});
Then in your template, you can access it like this:
<table class="table-history">
{{#collection App.GroupListView}}
<td class="col-left">
{{view.content.val}}
</td>
<td>
<span class="col-number-contact">{{view.content.id}}</td>
</td>
<td>
<div class="ph-img"></div>
</td>
<td>
<div class="ed-img"></div>
</td>
{{/collection}}
</table>