Ember Router and Controller

Question

I try to get the example from the Ember Guide to work but I dont get it:

window.App = Ember.Application.create()

App.Router.map ->
  this.route("about");
  this.route("favorites", { path: "/favs" })

App.IndexRoute = Ember.Route.extend({
  setupController: (controller) ->
    controller.set('title', "My App")
});

Template:

<h1>{{title}}</h1>
<nav>
  {{#linkTo "index"}}Index{{/linkTo}}
  {{#linkTo "about"}}About{{/linkTo}}
  {{#linkTo "favorites"}}Favorites{{/linkTo}}
</nav>

As I understand the example it should display the title when I reach the index page, but nothing happens. So could some see whats wrong here.

Answer 1

You are setting the title property in the IndexController, but it seems like your template is not the index template but rather the application template. You can change your IndexRoute to use controllerFor so you can access the ApplicationController (auto generated) and set a value to the property, similar to this:

App.IndexRoute = Ember.Route.extend
  setupController: (controller) ->
    @controllerFor('application').set('title', 'My App')

(see fiddle)

Or you can do it directly in the ApplicationRoute:

App.ApplicationRoute = Ember.Route.extend
  setupController: (controller, model) ->
    controller.set('title', 'My App')

(see fiddle)