How to serialize ember paginated data

Question

I am getting following json from my rest API:

{
  "content": [{
    "id": 56789,
    "name": "sample book",
    "status": "available"
  },{
    "id": 56789,
    "name": "sample book",
    "status": "available"
  }],
  "last": true,
  "totalElements": 5,
  "totalPages": 2,
  "size": 3,
  "number": 1,
  "sort": null,
  "first": false,
  "numberOfElements": 2
}

Ember Book Model

export default DS.Model.extend({
  id: DS.attr(),
  name: DS.attr(),
  status: DS.attr()
});

Ember Route

import Ember from 'ember';
import RouteMixin from 'ember-cli-pagination/remote/route-mixin';

export default Ember.Route.extend(RouteMixin, {

  model: function(params) {
      params.paramMapping = {
        perPage: "size"
      };
      return this.findPaged('book',params);
  }
});

In the Firefox network tab i can able to see the response but in browser console i am getting the following message:

Error while processing route: book.index data is undefined _pushInternalModel

In Chrome getting following exception:

ember.debug.js:30610 Error while processing route: books.index Cannot read property 'type' of undefined TypeError: Cannot read property 'type' of undefined

I am using following versions of ember:

"ember-cli": "2.5.0",
"ember-cli-pagination": "2.2.2"

I think i should serialize the response using "normalizeResponse" but i don't know how to do it.

As per Lux comment changed serializer :

import JSONSerializer from 'ember-data/serializers/json';
import DS from'ember-data';

export default DS.JSONSerializer.extend(DS.EmbeddedRecordsMixin, {
attrs: {
    product: {embedded: 'always'}
},
extractMeta(store, typeClass, payload) {
  let meta = [{
  "last": payload.last,
  "totalElements": payload.totalElements,
  "totalPages": payload.totalPages,
  "size": payload.size,
  "number": payload.number,
  "sort": payload.sort,
  "first": payload.first,
  "numberOfElements": payload.numberOfElements
}];
delete payload.content;
delete payload.last;
delete payload.totalElements;
delete payload.totalPages;
delete payload.size;
delete payload.number;
delete payload.sort;
delete payload.first;
delete payload.numberOfElements;

return meta;
},
normalizeArrayResponse(store, primaryModelClass, payload, id, requestType) {
let documentHash = {
  data: [],
  included: [],
  meta: this.extractMeta(store, primaryModelClass, payload),
};
payload.content.forEach(item => {
  let { data, included } = this.normalize(primaryModelClass, item);
if (included) {
  documentHash.included.push(...included);
}
documentHash.data.push(data);
});
}
});

Getting following error :

ember.debug.js:19750 TypeError: Cannot read property 'forEach' of undefined
at Class.normalizeArrayResponse (device.js:41)
at Class.normalizeQueryResponse (json.js:333)
at Class.normalizeResponse (json.js:228)

your payload should be in this format - http://stackoverflow.com/a/39725260/5771666 you need to normalize your responses to JSONAPI format standard. In normalizeResponse method if you print payload then it should be in above mentioned format — Ember Freak, Oct 05 '16 at 17:08
@kumkanillam thanks for your reply.yes i hope the code am I posted exactly follows the format you have shared but still no luck.please correct me if anything I'm doing wrong.Also apart from data I've few other attributes which I put it inside "included" attributes. Please guide me to resolve the issue — VelNaga, Oct 05 '16 at 17:19
May be you can try changing from JSONSerializer to RESTSerializer..(https://github.com/emberjs/data/pull/4259) sorry man I haven't worked much with ember-data...i hope some one will guide you... — Ember Freak, Oct 05 '16 at 17:32

score 0 · Answer 1 · answered Oct 05 '16 at 22:08

0

You should checkout the documentation.

I think you would have to implement extractMeta:

extractMeta(store, typeClass, payload) {
  let meta = [{
    "last": payload.last,
    "totalElements": payload.totalElements,
    "totalPages": payload.totalPages,
    "size": payload.size,
    "number": payload.number,
    "sort": payload.sort,
    "first": payload.first,
    "numberOfElements": payload.numberOfElements
  }];
  delete payload.content;
  delete payload.last;
  delete payload.totalElements;
  delete payload.totalPages;
  delete payload.size;
  delete payload.number;
  delete payload.sort;
  delete payload.first;
  delete payload.numberOfElements;

  return meta;
}

included are other included records. Informations like pagination data should be in the meta hash. So ember is thinking you provide it with additional records, but can't find the type of them.

Next you implement normalizeArrayResponse. Probably something like this will work for you:

normalizeArrayResponse(store, primaryModelClass, payload, id, requestType) {
  let documentHash = {
    data: [],
    included: [],
    meta: this.extractMeta(store, primaryModelClass, payload),
  };

  payload.content.forEach(item => {
    let { data, included } = this.normalize(primaryModelClass, item);
    if (included) {
      documentHash.included.push(...included);
    }
    documentHash.data.push(data);
  });
}

This is to extract your data from the content array.

answered Oct 05 '16 at 22:08

Lux

17,835
5
43
73

which serializer are you using JSONSerializer or JSONAPISerializer? – VelNaga Oct 06 '16 at 12:08
This is obviously basing on the `JSONSerializer`. I've linked to it. – Lux Oct 06 '16 at 12:35
thank you for your reply.I am getting Payload as empty inside "normalizeArrayResponse" – VelNaga Oct 06 '16 at 12:47
i resolved the serialization issue you are deleting content inside extractMeta function that throws an error, After resolving the issue i am getting "Cannot read property 'type' of undefined TypeError: Cannot read property 'type' of undefined" error in screen.Could you please guide me to resolve this issue – VelNaga Oct 06 '16 at 21:06
while debugging "documentHash.data.push(data);" Attributes & relationship objects are empty.Only prototype object is available.Wonder what might be the issue? – VelNaga Oct 06 '16 at 21:52
After executing "normalizeArrayResponse", ember executes "normalizeResponse" inside, it is again calling "extractMeta" which makes all the meta attribute as null since we are deleting all the attributes in "normalizeArrayResponse" simillary "attributes" & "Relationships" objects are also null. Do you know how to resolve this? – VelNaga Oct 06 '16 at 22:10
After "normalizeArrayResponse" it runs "_normalizeResponse" which makes or overrides our "meta" & "data" attribute as empty.It's strange – VelNaga Oct 07 '16 at 08:55

How to serialize ember paginated data

1 Answers1

Linked