CODEWITHSUNDEEP
javascriptember.jsember-data
Robin
Robin

Reputation: 21884

How to create a custom Serializer for Ember data

I have an API that returns JSON that is not properly formatted for Ember's consumption. Instead of this (what ember is expecting):

{ events: [
    { id: 1, title: "Event 1", description: "Learn Ember" },
    { id: 2, title: "Event 2", description: "Learn Ember 2" }
]}

I get:

{ events: [
    { event: { id: 1, "Event 1", description: "Learn Ember" }},
    { event: { id: 2, "Event 2", description: "Learn Ember 2" }}
]}

So if I understood correctly, I need to create a custom Serializer to modify the JSON.

var store = DS.Store.create({
    adapter: DS.RESTAdapter.create({
        serializer: DS.Serializer.create({
            // which hook should I override??
        })
    })
});

I've read the code comment related to the DS.Serializer, but I can't understand how to achieve what I want...

How can I do it?

ps: My goal is to make App.Event.find() work. Currently, I get Uncaught Error: assertion failed: Your server returned a hash with the key 0 but you have no mapping for it. That's why I need to fix the JSON received.

edit: Here's how I made it work, for now:

extractMany: function(loader, json, type, records) {
    var root = this.rootForType(type),
    roots = this.pluralize(root);

    json = reformatJSON(root, roots, json);
    this._super(loader, json, type, records);
  }

Upvotes: 10

Views: 8332

Answers (1)

Yehuda Katz
Yehuda Katz

Reputation: 28703

I am assuming that the responses contain the IDs only, and that you are trying to extract them.

You will want to subclass DS.JSONSerializer, which supplies the basic behavior for dealing with JSON payloads. In particular, you will want to override the extractHasMany hook:

// elsewhere in your file
function singularize(key) {
  // remove the trailing `s`. You might want to store a hash of
  // plural->singular if you deal with names that don't follow
  // this pattern
  return key.substr(0, key.length - 1);
}

DS.JSONSerializer.extend({
  extractHasMany: function(type, hash, key) {
    return hash[key][singularize(key)].id;
  }
})

Upvotes: 12

Related Questions