Eric Ocampo
Eric Ocampo

Reputation: 199

Define custom root json node on ember serializer

I'm trying to get brands items from my REST API with ember; but my API response does not match with ember-data expected. for example:

My model:

import DS from 'ember-data';

export default DS.Model.extend({
    name: DS.attr('string'),
    isActive: DS.attr('boolean')
});

My API url: http://localhost:3000/api/brands its response with:

{"success":true,
     "data":[
        {"id":1,"name":"Mine","isActive":true,"createdAt":"2017-04-23T20:36:49.000Z","updatedAt":"2017-04-23T20:44:32.000Z"},
        {"id":2,"name":"forever","isActive":true,"createdAt":"2017-04-23T20:41:14.000Z","updatedAt":"2017-04-23T20:43:57.000Z"}
    ]
}

but, Ember is expecting some like this:

"brands": [{

    "id": 1,
    "name": "foo",
    "isActive": "foo"

}]

I'm trying to change the root json node in serializer called brand.js, but I can not make it work. :(

here my serializer/brand.js

import DS from 'ember-data';

export default DS.RESTSerializer.extend({

});

and my adapters/application.js

import DS from 'ember-data';
import DataAdapterMixin from 'ember-simple-auth/mixins/data-adapter-mixin';
import config from '../config/environment';


export default DS.RESTAdapter.extend(DataAdapterMixin, {  
    host: `${config.host}`,
    namespace: `${config.namespace}`,
    authorizer: 'authorizer:custom'
});

on browser console this message appears:

WARNING: Encountered "success" in payload, but no model was found for model name "success" (resolved model name using vanely-web@serializer:brand:.modelNameFromPayloadKey("success"))
WARNING: Encountered "data" in payload, but no model was found for model name "datum" (resolved model name using vanely-web@serializer:brand:.modelNameFromPayloadKey("data"))

How can I say to ember where the correct data is?.Some help is appreciated.

Sorry if my English is not well.

Upvotes: 1

Views: 179

Answers (1)

Timm
Timm

Reputation: 1015

As you already did, you can override the RESTSerializer for every model.

What you want to achieve is response normalization. You can normalize your response by overriding normalizeResponse in your serializer (see the docs):

import Ember from 'ember';
import DS from 'ember-data';

const {
  RESTSerializer
} = DS;

const {
  get
} = Ember;

export default RESTSerializer.extend({
  normalizeResponse(store, primaryModelClass, payload, id, requestType) {
    // Only do normalization for reading:
    if(requestType !== 'createRecord' && requestType !== 'updateRecord' && requestType !== 'deleteRecord') {
      // Do your normalization here. For example (not tested):
      payload = {
        brands: get(payload, 'data')
      };
    }

    return this._super(store, primaryModelClass, payload, id, requestType);
  }
});

Instead of overriding normalizeResponse, you could also override the other normalization methods.

Upvotes: 1

Related Questions