Adding properties to a model within an EmberJS router
With the following router and handlebars code, I wanted to add a runtime property from the router to the template/view (note, using CoffeeScript):
Todos.TodosIndexRoute = Ember.Route.extend(
model: ->
@modelFor 'todos'
renderTemplate: (controller) ->
@render 'todos/index',
controller: controller
)
What you need to do is create a new setupController
function, but this must both set the model
again, along with any other parameters:
Todos.TodosIndexRoute = Ember.Route.extend(
model: ->
@modelFor 'todos'
renderTemplate: (controller) ->
@render 'todos/index',
controller: controller
setupController: (controller, model) ->
controller.set 'route', 'index'
controller.set 'model', model // critical - otherwise 'model' will be lost
)
This can then be used as normal Handlebars code, i.e.:
<script type="text/x-handlebars" data-template-name="todos/index">
{{route}}
<ul id="todo-list">
{{#each itemController="todo"}}
// ...
{{/each}}
</ul>
</script>
See also this StackOverflow discussion (not sure if it’s related) and my Github commit/branch that covers a related use case.