ember.js - {{outlet}}, {{view}}, {{render}}, and {{control}} helpers

Question

I am trying to put together a simple master-details Ember app. Directory tree on one side and file list on another.

Ember offers few helpers to render context into a view. Which of them I can use for:

1. Subtrees of the directory tree.
2. Details list.

In fact, would be very helpful if someone can point me to any docs I can read about the difference between {{render view}}, {{view view}} and {{control view}} helpers and how to use them properly.

Thanks a lot!

Answer 1

{{view "directory"}} renders the view within the context of the current controller.

{{render "directory"}} renders the view App.DirectoryView with template directory within the context of the singleton App.DirectoryController

{{control directory}} behaves the same way as render only it creates a new instance of App.DirectoryController every time it renders (unlike render which uses the same controller instance every time).

Update 18 Feb 2014: {{control}} has been removed.

The last two helpers are relatively new, so there isn't much documentation about them. You can find {{view}} documentation here.

Now looking at your use case, I don't think you need any of these helpers. Just use nested routes and the {{outlet}} helper and it should just work.

App.Router.map(function(){
  this.resource('directories', function() {
     this.resource('directory', { path: '/:directory_id'}, function() {
       this.route('files');
     });
  });
});

You can build on that following this guide.

UPDATE: {{render}} now creates a new instance every time if you pass a model.