I'm having a problem getting a response form an API in my Ember.JS application. I'm using a "dummy" API just to learn Ember with and I didn't feel like creating my own back end (this one specifically).
Whenever I try to navigate to the Posts
template I get the following error:
Error while processing route: posts Cannot read property 'all' of undefined TypeError: Cannot read property 'all' of undefined
at App.PostsRoute.Ember.Route.extend.model (file:///C:/Users/staff-ch/Documents/ember/js/app.js:24:18)
at EmberObject.default.extend.deserialize (file:///C:/Users/staff-ch/Documents/ember/js/libs/ember-1.12.0.debug.js:22318:19)
at applyHook (file:///C:/Users/staff-ch/Documents/ember/js/libs/ember-1.12.0.debug.js:45113:32)
at Object.HandlerInfo.runSharedModelHook (file:///C:/Users/staff-ch/Documents/ember/js/libs/ember-1.12.0.debug.js:43114:22)
at Object.subclass.getModel (file:///C:/Users/staff-ch/Documents/ember/js/libs/ember-1.12.0.debug.js:43340:21)
at __exports__.bind (file:///C:/Users/staff-ch/Documents/ember/js/libs/ember-1.12.0.debug.js:44982:19)
at tryCatch (file:///C:/Users/staff-ch/Documents/ember/js/libs/ember-1.12.0.debug.js:45439:16)
at invokeCallback (file:///C:/Users/staff-ch/Documents/ember/js/libs/ember-1.12.0.debug.js:45451:17)
at publish (file:///C:/Users/staff-ch/Documents/ember/js/libs/ember-1.12.0.debug.js:45422:11)
at file:///C:/Users/staff-ch/Documents/ember/js/libs/ember-1.12.0.debug.js:26472:7
Here is the relevant code:
App = Ember.Application.create();
App.ApplicationAdapter = DS.RESTAdapter.extend({
host: 'http://jsonplaceholder.typicode.com/'
})
App.Router.map(function() {
...
this.resource('posts');
});
App.Post = DS.Model.extend({
userId: DS.attr(),
title: DS.attr(),
body: DS.attr()
});
App.PostsRoute = Ember.Route.extend({
model: function(){
return DS.store.all('posts');
}
});
I suspect this might have to do with the format of the JSON being returned but I'm not sure and I'm don't sure how to fix it if that is the case. I obviously can't change the format of the JSON is being returned however I'm aware of DS.RESTSerilaizer
but I'm not sure how to use it. A sample of the response:
[
{
"userId": 1,
"id": 1,
"title": "sunt aut facere repellat provident occaecati excepturi optio reprehenderit",
"body": "quia et suscipit\nsuscipit recusandae consequuntur expedita et cum\nreprehenderit molestiae ut ut quas totam\nnostrum rerum est autem sunt rem eveniet architecto"
},...
]
1) Just
instead
return DS.store.all('posts');
DS.Store is injected into routes as
store
property.2) Your response must have root
posts
.