Angular return [object Object]

Question

I'm trying to send a post request. But the API returns undefined, and I send it to my API, as it turned out [object Object]

getAccouting():Observable<any>{
    // let json = this.http.get<any>('/assets/cities/altayskiy_kray/accounting.json'); if i use it json return undefined
    let json;
    this.http.get('/assets/cities/altayskiy_kray/accounting.json').pipe(data=>json=data);
    let formData:FormData = new FormData;
    formData.append('json', json);
    return this.http.post<any>('http://api/api.php', formData);
  }

How fix that?

Does this answer your question? Sending two HTTP Requests one after each other using Angular / RXJS where second request requires the first? — Christoph Lütjen
– Christoph Lütjen, Commented Dec 16, 2021 at 13:55
See the second answer for how to use a pipe this.http.get().pipe( mergeMap(response: Response => this.http.get(response.doSomething()) ). The docs for switchMap() operator are a good starting point too learnrxjs.io/learn-rxjs/operators/transformation/switchmap — Christoph Lütjen
– Christoph Lütjen, Commented Dec 16, 2021 at 13:57
"does not work" will not help to provide you a better answer. The linked answer shows the basics of how to do two async http calls and you really need to understand the basics. Assuming you now know how to do multiple http calls, how does your code looks like now and what exactly isn't working? — Christoph Lütjen
– Christoph Lütjen, Commented Dec 16, 2021 at 15:03
If i use this.http.get(), then get the error "an argument for the uri was expected". And if I add, as indicated above, then where mergeMap throws the error: "Type argument"(json: ArrayBuffer) => void" cannot be assigned to a type parameter "(value: ArrayBuffer, index: number) => ObservableInput<any>". The type "void" cannot be assigned to the type "Observable Input<any>".ts(2345)", but besides I wrote "mergeMap(json=>" — Qivorch Velix
– Qivorch Velix, Commented Dec 16, 2021 at 15:21

Steve Holgado · Accepted Answer · 2021-12-16 15:45:52Z

1

http.get is async so it will not have emitted before you return the http.post. Therefore, json will be undefined.

Instead you can chain them and return the whole observable:

getAccouting(): Observable<any>{
  return this.http.get('/assets/cities/altayskiy_kray/accounting.json').pipe(
    switchMap(json => {
      return this.http.post<any>('http://api/api.php', json);
    }
  );
}

Do you need to use FormData? If you append the json object then you will get its string value: [object Object].

You could stringify the json object, but you will have to decode it on the server:

formData.append('json', JSON.stringify(json))

edited Dec 16, 2021 at 15:45

answered Dec 16, 2021 at 14:11

Steve Holgado

12.1k4 gold badges26 silver badges34 bronze badges

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

5 Comments

Qivorch Velix Over a year ago

For some reason, I now need the json variable in FormData.append('json', json);

Steve Holgado Over a year ago

Do you need to use FormData?

Qivorch Velix Over a year ago

I do not know, but without it, the request is not sent

Steve Holgado Over a year ago

So you could append each key-value from the json object to the FormData. Or you could use formData.append('json', JSON.stringify(json)) but then you'd have to decode it on the other end.

Steve Holgado Over a year ago

You're welcome - glad it solved your issue :)

Collectives™ on Stack Overflow

Angular return [object Object]

1 Answer 1

5 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related