Include root in django rest framework responses - json

Question

I have a ready Django project that serves JSON via the rest_framework and its viewsets. Now I would like to write the client using Ember. Here is my setup:
Django 1.6.5
Ember 1.6.1
Ember-Data 1.0.0-beta.8.2a68c63a
jQuery 2.1.1
My Django server runs on the default port 8000 under localhost. I test my Ember application by opening index.html in the browser. Therefore, I customised the ApplicationAdapter like so
App.ApplicationAdapter = DS.RESTAdapter.extend({
host: 'http://localhost:8000',
});
I try to fetch a list of artists from http://localhost:8000/artists. The specified route is
App.ArtistsRoute = Ember.Route.extend({
model: function() {
this.store.find('artists');
}
});
And the response I get back from the server when I open the mentioned url in the browser is
[
{
"id": 1,
"name": "Kollegah",
"origin": "Germany",
"genre": "German Rap"
},
{
"id": 2,
"name": "Peter Fox",
"origin": "Germany",
"genre": "Hip-Hop"
},
{
"id": 3,
"name": "Farid Bang",
"origin": "Germany",
"genre": "German Rap"
},
{
"id": 4,
"name": "Eko Fresh",
"origin": "Germany",
"genre": "German Rap"
}
]
When fetching the data I these two Ember errors:
-Error while processing route: artists No model was found for 'artists' Error: No model was found for 'artists'
-No model was found for 'artists' Error: No model was found for 'artists'
The problem is that I have specified a model already
var attr = DS.attr;
App.Artist = DS.Model.extend({
name: attr,
origin: attr,
genre: attr,
});
I suppose the problem is the missing root element at the beginning of each JSON response. I suggest it should look like this example from the Ember Guides:
{
"post": {
"id": 1,
"title": "Rails is omakase",
"comments": ["1", "2"],
"user" : "dhh"
},
"comments": [{
"id": "1",
"body": "Rails is unagi"
}, {
"id": "2",
"body": "Omakase O_o"
}]
}
After searching a short while I found a similar problems with Rails. I tried out the solution for Django mentioned in another Stackoverflow question but I got the same errors.
Does anybody know a server-side solution for this problem? The Ember Data Django Adapter could be one for the client side. Unfortunately, it is designed as a node plugin and at the moment I don't use it for my project.

Answer 1

The Ember Data Django Adapter is the most simple way of solving your problem, and if you pay attention to the docs, there are instructions for using it without ember-cli.