Quantcast
Viewing all articles
Browse latest Browse all 4826

How to load value of data using links on JSON payload

@inagreen wrote:

Hi all,

I’m doing a little project to load some images from Nasa’s image API.

I’ve created an image model with ember data and managed to load the following data using external API from nasa - https://images-api.nasa.gov/search ?q=apollo

The last property that I would like to include in my image model is a string (link of json object e.g. https://images-assets.nasa.gov/image/as11-40-5874/collection.json), and going to this link, you get an array of strings (image urls).

What I want is to have an array of these image urls as the value of href instead of the json link that points to these arrays. How do I go about getting ember data to load these arrays from the said link in this model? Do I need to create another model (as image-urls)? They are just arrays with no ids, so I’m not sure if this is appropriate.


My image model:

"nasa_id": "as11-40-5874", 
"center": "JSC", 
"date_created": "1969-07-21T00:00:00Z", 
"description": “some string”, 
"keywords": [ "APOLLO 11 FLIGHT", "MOON", "LUNAR SURFACE", "LUNAR BASES", "LUNAR MODULE", "ASTRONAUTS", "EXTRAVEHICULAR ACIVITY" ], "media_type": "image", 
"title": “some string“
“href”: "https://images-assets.nasa.gov/image/as11-40-5874/collection.json"


My adapter (adapters/image):

import DS from 'ember-data';

export default DS.JSONAPIAdapter.extend({
    host: 'https://images-api.nasa.gov',
    namespace: 'search?',

    urlForQuery (query, modelName) {
      return `${this.host}/${this.namespace}`;
    }
});


My serializer (serializers/image):

import DS from 'ember-data';
import { underscore } from '@ember/string';

export default DS.JSONAPISerializer.extend({

    keyForAttribute(attr, method) {
        return underscore(attr);
    },
   
    normalizeResponse (store, primaryModelClass, payload, id, requestType) {

        payload.data = payload.collection.items.map((image) => {
            let dataAttributes = image.data[0];

            return {
              id: image.data[0].nasa_id,
              type: 'image',
              attributes: dataAttributes,
            }
        });


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

If anyone can shed some light that would be most appreciated.

Cheers

Posts: 1

Participants: 1

Read full topic


Viewing all articles
Browse latest Browse all 4826

Trending Articles