在父方法中调用订阅方法

Question

I have written a generic method like this:

getArticleById(loading: Loading): void {
    this.articleService.getArticleById(this.data.definition.id)
      .map((res: any) => res.json())
      .subscribe((res: any) => {
        if (res.definition.is_purchased) {
          //more code
          } else {
            //more code
          }
          loading.dismiss();
        } else {
           loading.dismiss();
        }
      }, () => { loading.dismiss(); });
  }

Parent method (or calling) is like this:

 myParentMethod(){
     const loading = this.loader.create({
      content: 'loading...'
    });
    loading.present();

    this.getArticleById(loading);//can I call the `loading.dismiss()` here. 
    }

I would like to remove the loading parameter from the genric method( getArticleById() ) and need to put that inside the parent method( myParentMethod() ) after resolving the subscription.Can you tell me how to do that?

Answer 1

To handle the observable terminating at the higher level, you'll need to return an observable that the higher-level function can access.

Try writing it like this:

getArticleById(loading: Loading) {
    const articles$ = this.articleService.getArticleById(this.data.definition.id)
      .map((res: any) => res.json());

    article$.subscribe((res: any) => {
        if (res.definition.is_purchased) {
          //more code
          } else {
            //more code
          }
    });

    return article$;  
}

finally is a useful operator which

Invokes a specified action after the source observable sequence terminates gracefully or exceptionally.

myParentMethod(){
    const loading = this.loader.create({
      content: 'loading...'
    });
    loading.present();

    this.getArticleById().finally(() => loading.dismiss());
}

However, this code is still structured a bit awkwardly. I'd separate out the logic to get the observable from that to handle it, and write the code as follows:

getArticleById(): Observable<Article> {
    return this.articleService.getArticleById(this.data.definition.id)
      .map(res => res.json());
}

handleArticle(article) {
    if (article.definition.is_purchased) {
      //more code
    } else {
        //more code
    }
}

myParentMethod(){
    const loading = this.loader.create({
      content: 'loading...'
    });
    const article$ = this.getArticleById();

    loading.present();

    article$
      .finally(() => loading.dismiss())
      .subscribe(article => this.handleArticle(article));
}