Dynamic navigation with Ember.js

nav_section_mixin.coffee

App.NavSectionMixin = Ember.Mixin.create({
  enter: (router, context) ->
    router.set("sectionNavigationController.current", @get("section"))
    @_super(router, context)

  exit: (router, context) ->
    router.set("sectionNavigationController.current", null)
    @_super(router, context)
})

router.coffee

...
    dashboard: Em.Route.extend(App.NavSectionMixin, {
      section: "dashboard"
      route: "/"
    })
...

section_navigation_view.coffee

App.SectionNavigationView = Ember.CollectionView.extend({
  classNames: ["main"]
  tagName: "ul"

  itemViewClass: Ember.View.extend({
    template: Ember.Handlebars.compile("""
      <a {{bindAttr href="view.href"}}><span>{{view.content.name}}</span></a>
    """)

    classNameBindings: ["isCurrent", "sectionClassName"]

    sectionClassName: (()->
      "nav-section-" + @get("content.section")
    ).property()

    isCurrent: (()->
      @get("controller.current") == @get("content.section")
    ).property("controller.current")

    href: (()->
      @get("controller.target").urlForEvent(@get("content.action"))
    ).property()

    click: (e) ->
      @get("controller.target").send(@get("content.action"), e)
      e.preventDefault()

  })
})