Ember.js render into view's outlet

Question

I've got a view that has a named outlet inside of it. This view is not associated with a controller and cannot be for my use case. I seem to be unable to render into that named outlet. How would I correctly target it?

If the view is named App.UnassociatedView, the named outlet is {{outlet potatoOutlet}}, and the controller and view that I wish to associate are App.PotatoController and App.PotatoView respectively, how do I make this work?

I've tried

App.ApplicationRoute = Ember.Route.extend({
    renderTemplate: function() {
        this.render();
        this.render('potato', {outlet: 'potatoOutlet', controller: this.controllerFor('potato')});
    }
});

This

App.ApplicationRoute = Ember.Route.extend({
    renderTemplate: function() {
        this.render();
        this.render('potato', {outlet: 'potatoOutlet', controller: this.controllerFor('potato'), into: 'application'});
    }
});

And This

App.ApplicationRoute = Ember.Route.extend({
    renderTemplate: function() {
        this.render();
        this.render('potato', {outlet: 'potatoOutlet', controller: this.controllerFor('potato'), into: 'unassociated'});
    }
});

Here is a js fiddle: http://jsfiddle.net/wmarbut/X8Mu4/

Edit for clarity

I had this in my comment text in the fiddle, but forgot to put it here. Moving the outlet into the root level isn't an option for me b/c the goal of this is to have the UnassociatedView actually generate outlets at page load time. My code to make the outlets actually works, I just can't connect them.

David Rice David Rice · Accepted Answer · 2013-08-08T19:35:56

I've fixed this up your jsfiddle somewhat.

App.IndexRoute = Ember.Route.extend({
  renderTemplate: function(){
    this._super();
    var controller = this.controllerFor('potato');
    this.render('potato', {outlet: 'potatoOutlet', controller: controller});
  }
})

http://jsfiddle.net/X8Mu4/5/

Moved outlet to root level
Moved renderTemplate override to IndexRoute (as that is what is routed to)
Enabled LOG_TRANSITIONS to aid debugging routing

I'd recommend not overriding ApplicationView's template as index. Leads to confusion.

You also do not have to explicitly create the ApplicationView. See: Do I have to explicitly create an `ApplicationView` and an `ApplicationController` for every Ember.js application?

Ember.js render into view's outlet

1 Answers