Creating Web applications with Ember.js

Question

I\'ve just found out about Ember.js, and it looks interesting. I\'d like to create a small notes app to learn how to use it.

The basic layout I have in mind is to have c

Answer 1

For simple wrapper-style layouts you can use Ember's built-in layout support. It only supports a single {{yield}} so may be too limited for your application.

For something a little more robust take a look at ghempton's Ember Layout. I think you'll find it quite similar to Rails layouts. He has a live example here.

Finally, it's fairly easy to create a hierarchy of views in Ember (instead of or in addition to using layouts). Tom Dale has a good collection of Ember resources and examples here.

Answer 2

Besides the approaches @rharper mentioned, you can also use the outlet helper, wich has been introduced in commit 5a4917b.

You can find an example here:

Handlebars:

<script type="text/x-handlebars" data-template-name="main" >
    Main View
    {{outlet contentView}}
    {{outlet footerView}}
</script>

JavaScript:

App.viewController = Ember.Object.create({
    footerView: Ember.View.create({
        templateName: 'footer'
    }),
    contentView: Ember.View.create({
        templateName: 'content'
    })
});

Ember.View.create({
    controllerBinding: 'App.viewController',
    templateName: 'main'
}).append();

Ember.run.later(function(){
    App.viewController.set('contentView', Ember.View.create({
        templateName: 'new-content'
    }));
}, 1000);

​