Alter data returned by http using map method in rxjs

Question

I have written code like below

getCalculatedValuesViaGet  = (myData): Observable < RmdResponse > => {
    return this._http.get('https://jsonplaceholder.typicode.com/posts',
                          { headers: this.getHeaders })
        .map((response: Response) => response.json())
        .map(x => { x.title = x.title + "hello world" })
        .catch(this.handleError);
}

Basically i want to append some extra info to each object returned from http method. My understanding is that first map converts it to JSON object. Second object should pass each object inside array and make the updation. But whole object is passed to second map method rather than each individual object. Looks like my understanding is wrong.

CozyAzure · Accepted Answer · 2017-08-05 02:08:55Z

2

Since your service is actually returning an array, you should use either .forEach or .map to transform each individual object:

getCalculatedValuesViaGet = (myData): Observable<RmdResponse> => {
    return this._http.get('https://jsonplaceholder.typicode.com/posts',
        {headers: this.getHeaders})
        .map((response: Response) => response.json())
        //the following x contains an array of objects, map to transform the data
        .map(x => {
                //this map is the function of array, not Observable.
                //iterate through each object, and update the value of `title`
                return x.map(y => Object.assign(y, {title: y.title + 'hello world'}))
            }
        )
        .catch(this.handleError);
}

edited Aug 5, 2017 at 2:08

answered Aug 5, 2017 at 1:58

CozyAzure

8,4987 gold badges39 silver badges56 bronze badges

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

Collectives™ on Stack Overflow

Alter data returned by http using map method in rxjs

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related