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

我有一个组件，首先需要调用发布内容的服务。然后在同一个组件中，我想等待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)
        .subscribe((res) => {
            if(res){
                console.log(res);
                if (---Post request done properly check via status or something else here----{
                    CALL YOUR GET REQUEST HERE.....
                    // GET call 
                    this._versionService.getAvailableVersions(); 
                }
                else {
                    DO something else whatever you want....
                }
            }
        });
    ...
}

private createNewVersion（值）{
...
//创建新版本，然后调用所有可用版本
//邮电
此.u newVersionService.createNewVersion（vnr）；
//接到电话
此._versionService.getAvailableEversions（）；
...
}

在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/nod_inspection_plugin/services/' + versionNr, null, {
        method: 'POST',
    })
    .map(response => {
        return [{status: response.status, json: response.json()}];
    },
    error => console.error(error));
}

导出类NewVersionService{
答复$：主题；
构造函数（私有的http:http）{
this.response$=新的BehaviorSubject（null）；
}
公共createNewVersion（版本号）{
这是http.post（'http://localhost:8080/services/'+versionNr，空{
方法：“POST”，
})
.订阅（响应=>{
this.response$.next（response.status）；
},
error=>console.error（error））；
}

谢谢！

您可以这样做： 将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));

---

另一种方法是订阅

新版本.component.ts中的
并在
POST
请求中呼叫您
获取
请求，即检查您的
POST
请求是否正确完成
如果正确完成了yes
POST
，请致电您的
GET
请求。如下所示：

在new-version.component.ts中：

 private createNewVersion(value) {
    ...
    // create new version, then call on all available versions

    // POST call
    this._newVersionService.createNewVersion(vnr)
        .subscribe((res) => {
            if(res){
                console.log(res);
                if (---Post request done properly check via status or something else here----{
                    CALL YOUR GET REQUEST HERE.....
                    // GET call 
                    this._versionService.getAvailableVersions(); 
                }
                else {
                    DO something else whatever you want....
                }
            }
        });
    ...
}

在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/nod_inspection_plugin/services/' + versionNr, null, {
        method: 'POST',
    })
    .map(response => {
        return [{status: response.status, json: response.json()}];
    },
    error => console.error(error));
}

导出类NewVersionService{
response$：Subject.
当调用返回一个
承诺时
将调用与

someFunction（）{
returnsPromise（）
。然后（结果=>doSomethingNext（））
。然后（结果=>doSomethingAfterThat（））；
}

确保您有一个
return
返回该链的
Promise
，这样
someFunc（）
的调用者也有机会在
dosomethingaftheat（）
完成后计时执行额外的工作

当调用返回一个
可观察的
时，使用
完成
回调

someFunction（）{
return returnsBServable（）
.订阅(
事件=>doForEachEvent（），
错误=>handleError（），
（）=>doSomethingNext（）
。然后（结果=>doSomethingAfterThat（））；
}

doSomethingNext（）
在最后一个
事件之后执行，并且
dosomethingaftheit（）
再次与
then（）
链接，以显示如何混合可观察和承诺。
doSomething（）
您应该能够
concat
来实现顺序，并
reduce
来收集发出的值：

var a = this._newVersionService.createNewVersion(vnr);
var b = this._versionService.getAvailableVersions(); 

Rx.Observable.concat(a, b).reduce((acc:Array<any>, x:any) => {
    acc.push(x); return acc;
}, []).subscribe(t=> { 
      var firstEmitted = t[0];
      var secondEmitted = t[1];
});

var a=this.\u newVersionService.createNewVersion（vnr）；
var b=此。_versionService.getAvailableVersions（）；
Rx.可观测的concat（a，b）.reduce（（acc:Array，x:any）=>{
acc.push（x）；返回acc；
}，[]）。订阅（t=>{
var=t[0]；
var=t[1]；
});
最好在这里使用
switchMap（）

const versions$ = this._newVersionService.createNewVersion(vnr)
                 .switchMap(response => this._versionService.getAvailableVersions());

versions$.subscribe(response2 => this.versions = response2)

但问题是，如果您在第一个问题解决之前发出另一个POST请求，那么之前的请求将被取消。
我这里有一个链接调用的示例：我的示例是get，但您可以将其更改为POST。您是否阅读过自己的代码？您的代码不可读。可能这就是原因