{{render}} inside {{#each}} ember.js

So, I have the following template:

<h2>Page layout item</h2>
Template name {{templateName}}
{{#each region in regions}}
  {{render "region" regions.firstObject}}
  <div>{{region.id}}</div>
  <div>{{region.height}}</div>
  <div>{{region.width}}</div>
{{/each}}

It does not render the regions. I was trying to render out each region using {{render "region" region}} but it wasn't working. However, when I put {{render "region" regions.firstObject}} outside the #each, it works. Regions is a list of objects that were obtained through ember-data via a async hasMany relationship. Any ideas why this is not working or a better way of doing this ? BTW, the other region. properties render fine.