Ember.js pre4, how to do the previous pre2 connectOutlet stuff

Question

In pre2, suppose I had this application code, outside the router:

  var controller = App.MyController.create();
  controller.content = [...];

  App.get('router').get('applicationController').connectOutlet({
    outletName: 'modal',
    controller: controller,
    viewClass: App.MyView,
    context: controller
  });

That is, I fill an outlet named 'modal' added to the 'application' template, with my data.

Now, in pre4 I have no reference to the controllers created by the router. How would you fill an outlet from outside the router?

I could ask the router for a transition, but I don't want to modify the URL, as I'm just opening a modal over the current content.

EDIT:

This is what I came up with for a temp fix, by looking up the application view from the App.Router.router object.. obviously it's a dirty hack, anyone know the best & right way to do it in pre4?

  var controller = App.MyController.create();
  controller.content = this.get('content');

  var theView = App.MyView.create();
  theView.set('controller', controller);

  App.Router.router.currentHandlerInfos[0].handler.router._activeViews.application[0].connectOutlet('modal', theView);

Sachsse

See this guide article: emberjs.com/guides/routing/rendering-a-template. EmberJS documentation is much better since pre2 – Samekh

Yes, but this does answer it, nor the ember documentation explains how to connect an outlet if not on a Ember.Route declaration. – Sachsse

Answer 1

If you just need to add your view into the app you can use my solution in this question:

What's the right way to enter and exit modal states with Ember router v2?

But if you need to add it too an outlet, you can do it by sending an event to the router and just render it in the event without transitioning it to another route.

events: {
    showModal: function(){
        this.render('modal', {into: 'index', outlet: 'modalOutlet', controller = this.controllerFor('modal')}); 
    }
}

See fiddle for an example:

http://jsfiddle.net/Energiz0r/gChWa/1

Schramke

Thanks for the comment, but a question: suppose the modal isn't just a static template, how would you pass an 'item' context to its view/controller, so each item clicked shows something different each time? – Sachsse

You can pass in context to the action helper, so if you send in <li {{action "showModal" item}}>{{item}}</li> you can use this context from the router. See the fiddle: jsfiddle.net/gChWa/2 my 'items' are only strings here, but in your case I suppose they should be an object and contain the information you need in the template. – Schramke