Angular http.post without .

subscribe callback
Asked
5 years, 11 months ago Modified
1 year, 1 month ago Viewed
27k times

I'm wondering if I can make just a http post request without subscribing on callbacks,
something like this
29
this._http.post('/list/items/update?itemId=' + itemId + "&done=" + done,
null);

instead of this

this._http.post('/list/items/update?itemId=' + itemId + "&done=" + done, null)

.subscribe();

angular typescript angular2-services

Share Improve this question edited Dec 23, 2016 at 6:47 asked Dec 23, 2016 at 6:09
Follow Vnuuk
5,995 11 35 51

Sorted by:
Reset to default
5 Answers
Trending (recent votes count more)

I do not think you can.

22 http.post (and get, put, delete, etc) returns a cold Observable, i.e. an Observable for which:

its underlying producer is created and activated during subscription

Source.

This means the function represented by the Observable is activated only with the
subscribe() method.

Convenience methods subscribe too, see implementation details for Observable#toPromise()

Share Improve this answer Follow edited Oct 13, 2021 at 16:14 answered Dec 23, 2016 at 6:33
Janos Vinceller Picci
1,085 8 25 15.8k 13 62 105

That question should be deleted or extended, since right now it is misleading. 2oppin has showed
 below that you actually can do it, so the statement I do not think you can. is wrong.
– Sasuke Uchiha
Jul 15, 2020 at 11:29

@Sasuke Uchiha I think that toPromise actually subscribes to the Observable in its implementation
– Picci
Jul 15, 2020 at 12:37

That is a very good catch. Could you, please, add it in your answer?
– Sasuke Uchiha
Jul 15, 2020 at
13:06

Just like @picci points, regular observables are cold observables. If you want to make the
request you can try @lex82 idea, here is a rxjs 6 draft:
6
import { ConnectableObservable } from "rxjs"

import { publish } from "rxjs/operators";

const myConnectableObservable: ConnectableObservable<any> =

myConnectableObservable.connect();

which basically is like a subscribe but without to make a real subscription.

https://blog.danlew.net/2018/09/25/connectable-observables-so-hot-right-now/

Share Improve this answer Follow answered Oct 19, 2019 at 3:37
Germán montes
61 1 1

I'm using conversion to Promise (requires rxjs):

12 import 'rxjs/add/operator/toPromise';

@Injectable()

export class SomeService {

....

post(sp: Seatplace, date?: Date) : Promise<any> {

return this.http.post(

'/list/items/update?itemId=' + itemId + "&done=" + done,

null

).toPromise();

Share Improve this answer Follow answered Dec 23, 2016 at 6:35
2oppin
1,923 21 33

I had the same question but then I figured out that I actually don't care if someone subscribes
to the observable. I just want the POST request sent in any case. This is what I came up with:
9
postItem(itemData) {
var observable = this.http.post('/api/items', itemData)

 .map(response => response.json()) // in case you care about returned

.publishReplay(); // would be .publish().replay() in RxJS < v5 I guess

observable.connect();

return observable;

The request is sent as soon as connect() is called. However, there is still an observable that
the caller of postItem can subscribe to if required. Since publishReplay() is used instead of
just publish() , subscribing is possible even after the POST request completed.

Share Improve this answer Follow edited May 8, 2017 at 11:55 answered May 8, 2017 at 11:48
lex82
11k 2 42 67

This throws error TS2339: Property 'json' does not exist on type 'Object'.
– JacobIRR
Aug 17, 2018 at 21:03

2 If someone else wants to use this approach with RxJS 6, you will have to cast the Observable to
connect it: const observable = this.http.post<T>('/api/items',
itemData).pipe(publishReplay()); (observable as ConnectedObservable<T>).connect();
return observable;
– kremerd
Dec 18, 2018 at 11:10

@kremerd ConnectableObservable not Connected... thanks!

You can simply use toPromise method like below:

1 public getEmployerListFromService() {

const url = `/list/items/update?itemId=`;

return this.http.get<any>(url).toPromise().then(response => {

console.log(response);

})

And Call this method by :

this.service.getEmployerListFromService();

Share Improve this answer Follow answered Aug 27, 2020 at 9:54
Praveen RL
498 9 12