Typescript - Angular http post

Question

I am building an autocomplete functionality.

1) The backend RESTful service returns following response for partially entered keyword.

JSON response

{
    "suggest": {
    "resultsuggest": [
      {
        "text": "Ke",
        "offset": 0,
        "length": 2,
        "options": [
          {
            "text": "Kevin Johnson",
            "_index": "customernames",
            "_type": "_doc",
            "_id": "1",
            "_score": 3
          }]
      }
  ]
}
}

2) In Angular application, what should I do to extract the options array from the JSON response and return it back for this fetch function?? Note - I want to use the Promise instead of Observable.

fetch(params?: HttpParams): Promise<any> {
        const query = params.get('query');
        const headers = new HttpHeaders().set("Content-Type", "application/json");
        let postData = "{ \"_source\": \"suggest\", \"suggest\": {\"resultsuggest\" : { \"prefix\" : \""+query+"\",\"completion\" : {  \"field\" : \"suggest\",  \"size\" : 5 }}}}";
        return this._http.post<any[]>('http://127.0.0.1:9200/customernames/_search?pretty',postData, {headers})
        .pipe(map(result=> {
                 // what should I do to extract the Options array from the JSON response and return it back in this fetch function??

                 return ????;
           }),
            delay(400)
        ).toPromise();
    }

Appreciate your help!

thanks!

Updated: 1) JSON response is fixed. 2) changed return this._http.post<any> to return this._http.post<any[]>

If my understanding is correct, this will work return JSON.parse(result).suggest.resultsuggest[0].options — MonkeyScript
– MonkeyScript, Commented Nov 3, 2018 at 6:52
No need to A COntent-Type header: HttpClient adds is automatically. No need for JSON.parse(): HttpClient parses automatically. No need to send a JSON string: send a JavaScript object, and HttpCLient sends is as JSON automatically. Read the HttpCLient guide. It's all explained and documented. — JB Nizet
– JB Nizet, Commented Nov 3, 2018 at 6:55
Thanks! This solved the issue. map(result=> { return result.suggest.resultsuggest[0].options; } — V Kal
– V Kal, Commented Nov 3, 2018 at 7:42

JB Nizet · Accepted Answer · 2018-11-03 16:54:15Z

0

As Arcteezy suggested, the following worked

map(result=> { return result.suggest.resultsuggest[0].options; }

edited Nov 3, 2018 at 16:54

JB Nizet

694k94 gold badges1.3k silver badges1.3k bronze badges

answered Nov 3, 2018 at 16:49

V Kal

11 bronze badge

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

Collectives™ on Stack Overflow

Typescript - Angular http post

1 Answer 1

Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Related