Attempting to create a profile page but App.User.find() errors

Question

I have a simple app on fiddle http://jsfiddle.net/kitsunde/qzj2n/2/

<script type="text/x-handlebars">
    {{outlet}}
</script>
<script type="text/x-handlebars" id="profile">
    Profile Page
    {{ email }}
</script>

Where I'm trying to display a profile page.

window.App = Ember.Application.create();

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

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

App.User.FIXTURES = [
  {
    id: 1,
    email: 'herpyderp@gmail.com'
  }
];

App.ProfileRoute = Ember.Route.extend({
    model: function(){
        return App.User.find().get('firstObject');
    }
});

But I'm getting an exception:

Error while loading route: TypeError: undefined is not a function

What am I missing?

Answer 1

There are a few things missing. You can find the fixed fiddle here:

http://jsfiddle.net/47cHy/

window.App = Ember.Application.create();

App.ApplicationAdapter = DS.FixtureAdapter;

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

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

App.User.FIXTURES = [
    {
        id: 1,
        email: 'herpyderp@gmail.com'
    }
];

App.ProfileRoute = Ember.Route.extend({
    model: function() {
        return this.store.find('user').then(function(users) {
            return users.get('firstObject');
        });
    }
});

• Your template had the id index and not the name of the route profile
• You have to tell Ember specifically to use the fixture adapter.
• You accessed the model directly via the global object. You should let Ember do the work via the internal resolver and use this.store.find.
• .find() returns a promise. You should get the first object in the then handler and return it there.