How to return an observable from a http service in angular2

Question

Unfortunately as I was storing many results on the service, I'm now stuck with many {{myservice.somevalue}} (and myservice.someother) etc. sprinkled over my other components.

I believe it would be nicer to return from the service to a component.

This is the code that I have on the service:

getIssue(issueName: string) {
    return this.http.post(this.URL + 'issue/all', JSON.stringify({'issueName': issueName}))
                    .subscribe(data => this.somevalue = data.json(),
                                err => console.log(err));
}

So then on several other components I call functions like this.myservice.getIssue(issueName).

In the HTML I'd prefer to use {{somevalue}}.

What can I do to return a http observable from the http service?

It's kinda unclear what do you want to do ? **return this.http.post(....)** is already an **Observable**. So you do return an Observable from the http service ¯\_(ツ)_/¯ — Tiberiu Popescu, Apr 24 '16 at 18:10
@tibs I completely agree it sounds silly. Unfortunately I'm not really sure how to describe what I'm looking for. — PascalVKooten, Apr 24 '16 at 18:23

score 1 · Answer 1 · edited May 23 '17 at 11:54

1

class SomeService {
  someValue = new BehaviorSubject();

  getIssue(issueName: string) {
      return this.http.post(this.URL + 'issue/all', JSON.stringify({'issueName': issueName}))
                      .subscribe(data => this.somevalue.next(data.json()),
                                  err => console.log(err));
  }
}

In your component

class MyComponent {
  constructor(someService:SomeService) {
    someService.someValue.subscribe(val => {
      this.someValue = val;
    });
  }
}

For an alternative approach see also https://stackoverflow.com/a/36291681/217408

edited May 23 '17 at 11:54

Community

1
1

answered Apr 24 '16 at 17:40

Günter Zöchbauer

623,577
216
2,003
1,567

That `this.somevalue.next` is new. How does that work? And what is `BehaviorSubject`, where does it come from? – PascalVKooten Apr 24 '16 at 17:52
Does this not introduce overhead; it seems like more work is done? – PascalVKooten Apr 24 '16 at 17:54
This is very cheap in relation to for example a DOM manipulation or even a server call. – Günter Zöchbauer Apr 24 '16 at 18:08
So does this solve the problem I think I'm having; is it a good practice? – PascalVKooten Apr 24 '16 at 18:21
Basically yes. It might vary slightly depending on the actual use case. See also http://stackoverflow.com/a/36291681/217408 – Günter Zöchbauer Apr 24 '16 at 18:23
Would it also be possible to `return this.http.post(...)` and then in the component do the subscribe `this.myservice.getIssue("").subscribe()` ? – PascalVKooten Apr 24 '16 at 18:24

How to return an observable from a http service in angular2

1 Answers1