CODEWITHSUNDEEP
angularrxjsobservable
David
David

Reputation: 3614

rxJS observable not reaching subscribe

I'm with Angular 2 and RxJS and I'm having a hard time setting up a simple observables system.

As far as I understand, operator do is used for side effects, and you place the code to deal with the results returned by the observable in the susbcribe() function.

So my Component ask the Service to initialize the system. The Service makes 2 http calls to the server and combines them both in a single stream for the component to subscribe and make sure everything is ready. One of the 2 http calls in the service is retrieving a fixed number of results from the server, which will be then served to the Component on demand. So when the Service sees that it needs more data, it makes another call to the server.

This was not working because I think I need to unsubscribe first to the original http call before making a new one (is that true?).

So this is what I've got... which is not working because it not getting to subscribe in the getQuestions method.

In the Component

ngOnInit() {
    // show spinner

    this.gamesService
      .initializeGame()
      .subscribe(data => {
        console.log('Game initialized');
        // remove spinner
      });
  }

In the Service

initializeGame(opponent_id: string): Observable<any> {
    return Observable
      .forkJoin([this.getQuestions(), this.newGame()]);
  }

  getQuestions(): Observable<any> {
    // composes postData with POST parameters

    this.questionsObservable = this.authHttp
      .post(this.settings.authApiUrl, postData)
      .map((response: Response) => response.json());

    this.questionsObservable
      .subscribe(data => {
        // save data in the service, which will be consumed
      })
      .unsubscribe(); // do I need to unsubscribe?

    return this.questionsObservable;
  }

  getQuestion(category: string): any {
    // consume question by Component
    if (no_more_questions_in_service) this.getQuestions();
    return question;
  }

So, this is now working. Why is not reaching the subscribe method?

Is there a better way to achieve this? Thanks

Upvotes: 1

Views: 2436

Answers (1)

David
David

Reputation: 3614

Ok, I realize (also, thanks @martin) I was unsubscribing before time.

I managed to get what I wanted, so in case someone wants to use it.

The service is now like this:

initializeGame(opponent_id: string): Observable<any> {
    return Observable
      .forkJoin([this.getQuestions(), this.newGame()]);
  }

  getQuestions(): Observable<any> {
    // postData

    return this.authHttp
      .post(this.settings.authApiUrl, postData)
      .map((response: Response) => response.json())
      .do(data => save_data);
  }

  private getQuestionsByCategory(category: string) {
    // postData

    this.authHttp
      .post(this.settings.authApiUrl, postData)
      .map((response: Response) => response.json())
      .subscribe(data => save_data
  }

  getQuestion(category: string): any {
    // consume question by Component
    if (no_more_questions_in_service)
      this.getQuestionsByCategory(category);
    }
    return question;
  }

So I have 2 different methods now; I don´t need to unsubscribe (I think) and it seems to be working fine now.

Upvotes: 2

Related Questions