Pattern for a navigation controller


Here I was thinking I was very smart. I created an outlet {{outlet nav}} in my application template, as I need it on every page. Then in my ApplicationRoute I run inside renderTemplate:

this.render('nav', { into: 'application', outlet: 'nav', controller: 'trucks' } );

Great, it works! I can iterate through my trucks content and create a nice dropdown jump menu from truck to truck.

Except the only reason it works is that my root path is this.resource('trucks', { path: '/' });. The trucks route is setting up the controller, loading it with model data, and making it available in the nav template.

If I hit directly any other page, while my ApplicationRoute is fired and I do render the template into the nav outlet, no trucks controller content is ever ready for consumption. My dropdown is empty.

Stop the madness! Where have I gone wrong?


One option would be to use the ApplicationController, and to just set the needs property. So for example:

App.ApplicationController = Ember.ObjectController.extend({
  needs: ["trucks", "cars"]

And then you can use controller.controllers.trucks in your view/template. This would require you to update your render options. There might be other ways to do this as well…