How do I access the model data from the controller to render in the view in Ember?

1
votes

I am currently having trouble trying to render data from my model in the handlebars template. I can see the data is being pulled in from the API as it is showing within the data in the Ember Chrome inspector.

I am using Ember v1.9.1 and Ember Data 1.0.0-beta.16.1.

However when trying to loop through the controller's model data, nothing is rendering on the page. Here is my code so far:

Model:

App.User = DS.Model.extend({
  name: DS.attr('string'),
  email: DS.attr('string')
});

Router:

App.Router.reopen(
{
  location: 'auto',
  rootURL: '/'
});

App.Router.map(function() 
{
  this.resource('users', { path: '/users' });
});

Route:

App.UsersRoute = Ember.Route.extend({
    model: function()
    {
        this.store.find('user');
    }
});

Template:

users template
<ul>
    {{#each user in model}}
        <li>
            Name: {{user.name}}
            Email: {{user.email}}
        </li>
    {{/each}}
</ul>

Why is my handlebar template not rendering the data on the page?

1
ember.jsember-datahandlebars.js

1 Answers

1
votes

Route:

App.UsersRoute = Ember.Route.extend({
    model: function() {
        return this.store.find('user'); // <-- missing return statement
    },

    // default behaviour
    setupController: function(controller, model) {
      controller.set('model', model);
    }
});