RxJs Help in Angular / SharePoint Search HTTP Call

Question

I have done a great deal of work trying to refactor this method (and maybe this is as simple as it can get). I am calling a SharePoint Search Query API, which is returned in a strange JSON way (nested and nested - example below code). This code simplifies it to optimize for consumption in an Angular ngFor. However, I am hoping to get some insight on how I could simplify this, as I am still struggling with RxJs. TIA!

getSearchQuery(term) {
return this.http.get(this.variables.spUrl + this.queryAPI + '%27' + term + this.queryOptions + '%27', this.options)
    .map(res => res.json().d.query.PrimaryQueryResult.RelevantResults.Table.Rows.results)
    .map(data => data.map(item => item.Cells.results))
    .map((data, i) => {
        data.map((object, i) => {
            this.newProp = {};
            object
                .map(prop => {
                    let key = prop.Key;
                    let value = prop.Value;
                    this.newProp[key] = value;
                });
            object = this.newProp;
            this.newData.push(object);
        });
        console.log(this.newData);
        return this.newData;
    })
    .share()

}

Code that console.logs the image attached below:

    getSearchQuery(term) {
        return this.http.get(this.variables.spUrl + this.queryAPI + '%27' + term + this.queryOptions + '%27', this.options)
            .map(res => res.json().d.query.PrimaryQueryResult.RelevantResults.Table.Rows.results)
            .map(data => data.map(item => item.Cells.results))
            .do(data => console.log(data))
}

Why are you have this.newProp? It always set one time per first object map. Do you need to store this.newData in the class? — Lyubimov Roman
– Lyubimov Roman, Commented Aug 16, 2017 at 15:41
I was only using them to get what I needed. I don't need either for anything else other than this function. — kittycatbytes
– kittycatbytes, Commented Aug 16, 2017 at 16:29

Lyubimov Roman · Accepted Answer · 2017-08-16 16:37:07Z

1

Like this:

getSearchQuery(term: string) {
  const url = `${this.variables.spUrl}${this.queryAPI}%27${term}${this.queryOptions}%27`;
  return this.http.get(url, this.options)
    .map(res => res.json().d.query.PrimaryQueryResult.RelevantResults.Table.Rows.results)
    .map(rowResults => rowResults.map(item => item.Cells.results))
    .map(this.remapResults)
    .do(data => console.log(data)) // Do whatever you want with new data.
    .share();
}

remapResults(results:  any[]) {
  return results.map(object => {
    const newProp = {};
    for (const prop of object) {
      const {Key, Value} = prop;
      newProp[Key] = Value;
    }
    return newProp;
  });
}

edited Aug 16, 2017 at 16:37

answered Aug 16, 2017 at 16:10

Lyubimov Roman

1,2691 gold badge15 silver badges27 bronze badges

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

2 Comments

kittycatbytes Over a year ago

Actually when I try this I get error "core.es5.js:1084 ERROR TypeError: Cannot set property 'Rank' of undefined"

Lyubimov Roman Over a year ago

Yeah, sorry, forgot to change this.newProp to newProp, edited my answer.

Collectives™ on Stack Overflow

RxJs Help in Angular / SharePoint Search HTTP Call

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related