Angular2 - 如何在组件中链接异步服务调用(http请求)？

Question

我有一个组件,首先需要调用POST的服务.然后在同一个组件中我想等到POST完成后,调用另一个获取数据的服务.

如何进行GET调用等待POST调用完成？

在new-version.component.ts中:

private createNewVersion(value) {
    ...

    // create new version, then call on all available versions

    // POST call
    this._newVersionService.createNewVersion(vnr);

    // GET call
    this._versionService.getAvailableVersions(); 

    ...
}

在new-version.service.ts中:

export class NewVersionService {

response$: Subject<any>;

constructor(private _http: Http) {
    this.response$ = new BehaviorSubject<any>(null);
 }

public createNewVersion(versionNr) {    
    this._http.post('http://localhost:8080/services/' + versionNr, null, {
        method: 'POST',
    })
    .subscribe(response => {
        this.response$.next(response.status);
    },
    error => console.error(error));
}

谢谢!

Answer 1

当一个调用返回一个Promise链调用时

someFunction() {
  return returnsPromise()
    .then(result => doSomethingNext())
    .then(result => doSomethingAfterThat());
}

确保你有一个return返回该Promise链的那个,这样调用者someFunc()也有机会在doSomethingAfterThat()完成后执行额外的工作.

当一个调用返回一个Observable然后使用complete回调

someFunction() {
  return returnsObservable()
    .subscribe(
      event => doForEachEvent(),
      error => handleError(),
      () => doSomethingNext()
          .then(result => doSomethingAfterThat());
}

doSomethingNext()在最后一个之后执行,event并doSomethingAfterThat()再次链接then()以显示如何混合observable和promise.doSomething().

Answer 2

您可以这样做：将 createNewVersion 更改为：

public createNewVersion(versionNr) {
 return this._http.post('http://localhost:8080/nod_inspection_plugin/services/' + versionNr, null, {
    method: 'POST',
 });
}

然后在你的通话中：

this._newVersionService.createNewVersion(vnr).subscribe(response=> {
 this._versionService.getAvailableVersions(); 
}, error => console.error(error));