Ember Data: can't get a model from data store

Question

I have tried to populate a template with Ember Data. I'm getting a weird problem when I try to find a model inside my DS Store. I've followed some tutorials but got an irritating error.

The error is 'Error while loading route: undefined'.

What I've tried:

MovieTracker.Store = DS.Store.extend({
  url: 'http://addressbook-api.herokuapp.com'
});

MovieTracker.Contact = DS.Model.extend({
  first: DS.attr('string'),
  last: DS.attr('string'),
  avatar: DS.attr('string')
});

MovieTracker.Router.map(function() {
  this.resource('contacts');
});

MovieTracker.ContactsRoute = Ember.Route.extend({
    model: function(){//works when changing to 'activate:'
        //return; //this works! it shows me a simple template and updates URL to index.html#/contacts
        return this.store.find('contact');//error: 'Error while loading route: undefined'
    }
});

In the Index.html I have a simple #link-to to 'contacts' (application handlebar), it works well. I have also a simple template called contacts, which works fine when I give up the this.store.find('contact') line.

JSBin: http://emberjs.jsbin.com/OxIDiVU/170/edit?html,js,output The JSON is in: http://addressbook-api.herokuapp.com/contacts

Can you please give me any advice? Would you prefer Ember Data at all (1.0 Beta 5). Another question: a website without precompiling the handlebars is not gonna be a good idea?

Thank you a lot for reading!

Is the response from the server correct? Can you post the response from the server. Getting Ember data to work is a bit problematic but once everything is worked out, it does work pretty well. I have a fairly large site set up on Ember.js and Ember data. — Gautham
Hi Gogu, sure, this is the spesific url I am using: addressbook-api.herokuapp.com. Ember Data should actually access this site /contacts, and get the JSON. I hope I'll succeed to set everything well like you, thank you! — TechWisdom
I've continued to play around, and discovered that if I change the 'model:' property in the ContactsRoute to 'activate:' It getting further. The error is not being displayed, but another error yells me about '#each loops over must be an Array'. I don't know what the meaning of changing the 'model' to 'activate', but hope it helps you to understand the origin of the error. — TechWisdom
Try this: this.resource('contacts', {path:'/'}) if you named your handlebar as index. Can you setup a jsbin if that fails too. — Deewendra Shrestha
Hi Deewendra! Unfortunately it didn't succeed. I uploaded the code to jsbin: emberjs.jsbin.com/OxIDiVU/170/edit?html,js,output — TechWisdom

Kingpin2k Kingpin2k · Accepted Answer · 2014-01-25T16:38:52

When defining the host you define that on the adapter, not the store.

MovieTracker.ApplicationAdapter = DS.RESTAdapter.extend({
  host: 'http://addressbook-api.herokuapp.com'
});

Additionally, you shouldn't define the id on the model, it's there by default

MovieTracker.Contact = DS.Model.extend({
  first: DS.attr('string'),
  last: DS.attr('string'),
  avatar: DS.attr('string')
});

http://emberjs.jsbin.com/OxIDiVU/172/edit

And the newer versions of ember data aren't documented on the website yet, but the transition document should help explain some of the nuances and changes.

https://github.com/emberjs/data/blob/master/TRANSITION.md

Ember Data: can't get a model from data store

1 Answers