Angular 2 :How to detect the completion of HTTP request?

Question

我在 Angular 2 中有以下 Http put 请求:

...
...
private Url='api/demo/'    
UpdatState(obj: Model) {
        let headers = new Headers({
            'Content-Type': 'application/json',
        });
        return this.http.put(this.Url + obj.Id, JSON.stringify(obj), { headers: headers }).map(res => res.json().data).subscribe(..);
    }

并获取相同型号的服务:

 getState(){
  return this.http.get(this.Url)
        .map(response => response.json());        
}

问题:我已经以这样的方式设置了我的组件，即首先发生放置请求——这改变了我在 Db 中的表。紧接着，获取表条目的获取请求发生。但是，在 Put 请求完成之前，get 完成了它的执行。

...
...    
onSomeEvent(){
    this.updatestate(obj);
    this.getState();
    }
...
...

如何在 Angular 2 中检测我的 http 请求是否完成？

编辑:从@Gunter 的回答中，我为我的 put 订阅方法提供了三个回调:

UpdatState(obj: Model) {
     let headers = new Headers({
     Content-Type': 'application/json',
     });
     return this.http.put(this.Url + obj.Id, JSON.stringify(obj), { headers: headers })
.map(res => res.json().data)
.subscribe(
    (a) => { this.b = a }, //b is my local array
    err => { this.error = err; }, //error is my local string variable
    () => { this.completed(); }
    );
}

我完成的方法是:

 completed(){
alert("Request completed");
}

Answer 1

您可以将三个回调传递给 subscribe(...)

this.http.put(...).subscribe(
  value => this.doSomething(value), // called for each value
  error => this.handleError(err),
  () => this.completed()
})

最后一个在可观察对象关闭时调用。因为 http.xxx() 总是只发出一个值然后关闭 observable，所以第一个和最后一个几乎相同。

还有 finally() 运算符，在任何情况下(成功和错误)都会被调用。