rendering .hbs templates in Ember

Question

I'm looking at an Ember demo project https://github.com/kagemusha/ember-rails-devise-demo that uses templates endeding in .hbs. Normally in Ember, you declare the template by attaching, for example, id='about' for the about route. However, none of the templates ending in .hbs in this project use an id. How does Ember know which template to render?

Example template

<div class="navbar navbar-fixed-top">
  <div class="navbar-inner">
    <div class="container-fluid">
      <div class="brand strong">{{#linkTo 'home'}}Ember-Rails-Devise{{/linkTo}}</div>
      <ul class="nav">
          <li>{{#linkTo help}}Help{{/linkTo}}</li>
      </ul>
      <div class="btn-group pull-right">
        {{#if isAuthenticated}}
            <button class="btn" {{action logout}}>Logout</button>
        {{else}}
            {{view App.MenuItem href="#/login" label="Login" }}
            {{view App.MenuItem href="#/registration" label="Register"}}
        {{/if}}
      </div>
    </div>
  </div>
</div>

Voldy Voldy · Accepted Answer · 2013-09-13T16:52:48

Ember.js uses naming convension.

When we define routes in ember app, we tell Ember which controller will respond at which path and which template will be rendered:

App.Router.map ()->
  @resource 'posts'

Here we have:

URL         /posts
Route Name  posts
Controller  PostsController
Route       PostsRoute
Template    post

PostsController controller will render posts.hbs template. This is pretty similar to Rails. Of cause we can customise almost everything here.

rendering .hbs templates in Ember

1 Answers