Angular http.post without .subscribe callback

Question

I'm wondering if I can make just a http post request without subscribing on callbacks, something like this

 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();

Solution 1

I do not think you can.

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() here.

Solution 2

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

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();
  }
}

Solution 3

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:

postItem(itemData) {
    var observable = this.http.post('/api/items', itemData)
        .map(response => response.json()) // in case you care about returned json       
        .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.

Solution 4

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:

import { ConnectableObservable } from "rxjs"
import { publish } from "rxjs/operators";

const myConnectableObservable: ConnectableObservable<any> = this._http.post('/list/items/update?itemId=' + itemId + "&done=" + done, null).pipe(publish()) as 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/

Solution 5

You can simply use toPromise method like below:

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();

View more solutions

Comments

[JacobIRR]

This throws error TS2339: Property 'json' does not exist on type 'Object'.

[kremerd]

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;

[Will Shaver]

@kremerd ConnectableObservable not Connected... thanks!

[Sasuke Uchiha]

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.

[Picci]

@Sasuke Uchiha I think that toPromise actually subscribes to the Observable in its implementation

[Sasuke Uchiha]

That is a very good catch. Could you, please, add it in your answer?