Getting key and value from JSON with angular2

Question

I am looking for best solution how to work with JSON in my angular2 app.

My JSON is:

{
    "rightUpperLogoId": {
        "id": 100000,
        "value": ""
    },
    "navbarBackgroundColorIdCss": {
        "id": 100001,
        "value": ""
    },
    "backgroundColorIdCss": {
        "id": 100002,
        "value": ""
    },
    "translationIdFrom": {
        "value": "90000"
    },
    "translationIdTo": {
        "value": "90055"
    }
}

This JSON is something like configuration file for UI of app. In my application, I want to get id from rightUpperLogoId, it is 100000. With this id I need to do GET task on my backend REST api and the returned value I would like to set to value. Thank you

Thierry Templier · Accepted Answer · 2016-05-24 08:27:46Z

4

You could leverage Rx operators like the flatMap one with Observable.forkJoin / Observable.of.

Here is a sample:

this.http.get('config.json')
       .map(res => res.json())
       .flatMap(config => {
         return Observable.forkJoin(
             Observable.of(config),
             // For example for the request. You can build the
             // request like you want
             this.http.get(
               `http://.../${config.rightUpperLogoId.id}`)
         );
       })
       .map(res => {
         let config = res[0];
         let rightUpperLogoIdValue = res[1].json();

         config.rightUpperLogoId.value = rightUpperLogoIdValue;

         return config;
       })
       .subcribe(config => {
         // handle the config object
       });

This article could give you more hints (section "Aggregating data"):

http://restlet.com/blog/2016/04/12/interacting-efficiently-with-a-restful-service-with-angular2-and-rxjs-part-2/

answered May 24, 2016 at 8:27

Thierry Templier

203k44 gold badges407 silver badges365 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Loutocký Over a year ago

Copy and paste, small customization and everything works perfect. Thank you!

Collectives™ on Stack Overflow

Getting key and value from JSON with angular2

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related