Ember.JS: template created with ember-cli not rendering property from route

Question

I am trying to learn Ember.JS by following the Gaslight training videos . During "Step 1: Templating", Mitch Lloyd provides a very simple example of dynamically rendering a name property in the application template. I followed the instructions, but the name does not appear on the screen. Here are the two file I edited after using ember new to create the app.

app/templates/application.js

import Ember from 'ember';

export default Ember.Route.extend({
  model: function () {
    return {name: "Joe"};
  }
});

app/routes/application.hbs

<h2 id="title">Welcome to Ember.js</h2>

{{name}}

I am using ember-cli version 2.12.1, emberjs version 1.13.1, and chrome version 44.0.2403.89 (64-bit). According to the Ember Inspector, the name property is available in the model. I just don't understand why it is not showing up in the template. I think it might be a problem with my version of ember-cli, because I was able to get the template to render the name property in this JSBin .

I am completely new to Ember.JS and ember-cli, so please excuse my ignorance. Why is the application template not loading the name property from the model? I would really appreciate any solutions, suggestions, or advice. Thank you!

Answer 1

Ember, and Ember-CLI, change so quickly that many (most) tutorials, etc. are outdated. Because it's a property of the route, and not the controller, you should use {{model.name}}

Yes, it's very confusing.