Components with structured markup in ember.js v1.10

Design
1

Wrote up a quick example of creating structured component templates in 1.10:

Instantiate component like this:

{{#my-comp as |section|}}
  {{#if section.isHeader}}
    My header
  {{else if section.isBody}}
    My body
  {{else if section.isFooter}}
    My footer
  {{/if}}
{{/my-comp}}

Results in

<div>
  <header>My header</header>
  <div class="body">My body</div>
  <footer>My footer</footer>
</div>