Ember Data Not binding attributes


#1

I started developing an example project in EmberJS, see https://github.com/HolgerPeters/ember-example-app/tree/rev1 for the complete repo.

I wrote a small service in Python as an endpoint, offering a JSONAPI REST interface service.py

Now I try to make an emberJS UI for this. In principal it seems to work, i.e. emberjs retrieves the information from the server. However, in the templates for the persons route.

It doesn’t seem like the attributes of the person, the name and email for example are not bound in the template and I have run out of ideas on how to debug this. Where is my mistake, what is missing? How can I debug this better.

PS: I would have liked to link to all the files mentioned here, but “discuss” seems to restrict new users from providing many links.


#2

I got your service.py running, and this is what it’s returning:

GET /persons/1
{
    "data": {
        "attributes": {
            "birthdate": "2018-07-15",
            "display_name": "ERNIE <ernie@example.com>"
        },
        "id": "1",
        "links": {
            "self": "/persons/1"
        },
        "relationships": {
            "computers": {
                "links": {
                    "related": "/persons/1/computers",
                    "self": "/persons/1/relationships/computers"
                }
            }
        },
        "type": "person"
    },
    "jsonapi": {
        "version": "1.0"
    },
    "links": {
        "self": "/persons/1"
    }
}

This model doesn’t have a name attribute. It has a display_name attribute.

If you want to leave your server as it is and make your Ember app understand that display_name should become model.name, you can use a custom serializer that remaps which key in the API goes to which attribute in the model:

// app/serializers/person.js
import DS from 'ember-data';

export default DS.JSONAPISerializer.extend({
  keyForAttribute(attr) {
    switch (attr) {
      case 'name':
        return 'display_name';
      default:
        return attr;
    }
  }
});

More practically, you should probably create a general rule here that will follow whatever flask_rest_jsonapi's conventions are for naming fields. Note that the default mapping for Ember Data’s JSONAPISerializer is to use dasherized names, so if you try to make a displayName attribute on your model, it would look for display-name in the API, not display_name. Switching from dashes to underscores is one of the examples in the docs.


#3

Hi, thanks a lot, the resource in flask_rest_jsonapi indeed had a name attribute, but it was set to write-only, so it didn’t show up in the GET request’s response. This is what kind of tripped me up, because I normally have good experience with flask_rest_jsonapi. Thanks for putting in the time to start the server and find the issue.