【问题标题】:Angular 2 error handling - send to subscribed componentAngular 2 错误处理 - 发送到订阅的组件
【发布时间】:2017-07-29 08:54:30
【问题描述】:

我正在使用 Angular 2 HTTP,并且有一个订阅响应的组件。但是,当发生错误时,catch 方法不会将错误返回给订阅的组件。它只是将它扔到控制台中。

 saveFinalize(fcData: LastForecastInterface) {
    let responseData = JSON.stringify(fcData);
    let body = responseData;

    const headers = new Headers();
    headers.append('Content-Type', 'application/json;charset=UTF-8');

    return this.http.post('/saveFinalize', body, { headers: headers })
      .map((data: Response) => data.json())
      .catch(this.handleError);
}

public handleError(error: Response | any) {
    console.log('err: ', error)
    let errMsg: string;
    if (error instanceof Response) {
        const body = error.json() || '';
        const err = body.error || JSON.stringify(body);
        errMsg = `${error.status} - ${error.statusText || ''} ${err}`;
    } else {
        errMsg = error.message ? error.message : error.toString();
    }
    console.error(errMsg);
    // return Observable.throw(errMsg);
    return errMsg;
}

而且我订阅的组件没有得到响应

saveFinalize() {
  this.loadingData = true;
  return this.httpService.saveFinalize(this.getFc.fcData)
    .subscribe(response => {
        this.loadingData = false;
        console.log(response);
        let saveResponse = response.success ? 'Successfully Saved Finalized!' : 'Error Saving Finalized! - ' + response.message;
        let respType = response.success ? 'success' : 'danger';
        this.alertSvc.showAlert(saveResponse, respType);
    });
}

【问题讨论】:

标签: javascript angular error-handling rxjs


【解决方案1】:

你可以的

.catch((response: Response) => {
                return Observable.of(response);
            });

它将为您返回响应。

【讨论】:

  • 这对我不起作用,但上面来自 samAlvin 的答案确实有效。不过,谢谢您的快速回复。
【解决方案2】:

在此处查看此代码:(来自https://angular.io/docs/ts/latest/guide/server-communication.html

getHeroes() {
  this.heroService.getHeroes()
                  .subscribe(
                    heroes => this.heroes = heroes,
                    error =>  this.errorMessage = <any>error);
}

注意 .subscribe() 方法有 2 个参数。一个是您使用的响应,下一个是错误。为了将错误传递给订阅的组件,您必须使用 later 参数,这将使您的代码如下所示:

  return this.httpService.saveFinalize(this.getFc.fcData).subscribe(response => {
    this.loadingData = false;
    console.log(response);
    let saveResponse = response.success ? 'Successfully Saved Finalized!' : 'Error Saving Finalized! - ' + response.message;
    let respType = response.success ? 'success' : 'danger';
    this.alertSvc.showAlert(saveResponse, respType);
  }, error => {
    // the errorMessage will be passed here in this "error" variable
  });

当订阅的方法返回一个成功的响应时,你只会得到你的响应。但是当订阅的方法抛出错误时,你不会得到响应,你只会得到错误(这是 subscribe() 方法的第二个参数)。

您还需要从 handleError() 方法中抛出错误。因此,您应该使用return Observable.throw(errMsg);,而不是只返回字符串值(return errMsg;)。

【讨论】:

  • @ahrobins 很高兴能帮上忙 :)
猜你喜欢
  • 2017-12-26
  • 1970-01-01
  • 2017-11-25
  • 1970-01-01
  • 1970-01-01
  • 2017-08-08
  • 2017-08-01
  • 1970-01-01
  • 2017-07-16
相关资源
最近更新 更多