等待订阅完成设置公共变量

时间:2018-09-02 17:17:54

标签: javascript typescript asynchronous rxjs

在组件上,我从服务中获得了一些翻译。
该服务会调用MVC API控制器。

组件上的代码:

  private getTranslations(): void {
    this._translationService.getTranslations('Foo');
  }

服务代码:

  public translations: Translation[] = new Array<Translation>();

  public getTranslations(action: string) {
    this._http.get<Translation[]>(this.baseUrl + action).subscribe(
      (result: Translation[]) => {    
         result.forEach(element => {
            this.translations.push(element);
         });
      },
      (error: any) => this._loggerService.logError(error)
    );
  }

在服务中,它在订阅中的变量this.translations上设置一个值。
我该如何在组件中等待“完成”,这意味着已设置公共变量this.translations

我看到了一个将其包装在new Promise()中的线程,但是在我的示例中我无法弄清楚。可以使用任何方法。

1 个答案:

答案 0 :(得分:0)

您可以从服务中返回observable

 public translations: Translation[] = new Array<Translation>();

 public getTranslations(action: string) {
    return new Observable((observer) => { // <-- return an observable
      this._http.get<Translation[]>(this.baseUrl + action).subscribe(
        (result: Translation[]) => {    
           result.forEach(element => {
              this.translations.push(element);
           });

           observer.complete(); // <-- indicate success
        },
        (error: any) => {
          this._loggerService.logError(error);
          observer.error(error); // <-- indicate error
        }
      );
    });
  }

并订阅该组件:

  private getTranslations(): void {
    this._translationService.getTranslations('Foo').subscribe({
      error: () => { /* handle error */ },
      complete: () => { /* handle complete */ },
    });
  }