Question

我该如何处理Angular组件而不是Angular服务中的错误？

当前我的错误被捕获到我的服务中，但是如果将错误返回给组件以方便记录，那就太好了。

我已经做了很多搜索和测试，但是找不到适合我的简单解决方案。我希望有一个简单的解决方案，可以在下面修改我的代码（请注意，我是NEWB;））。

我有一个非常简单的设置：

在我的组件中：

  ngOnInit() {
    this.orders = this.authService.registerUser().subscribe(response => {
      return response;
    });
  }

为我服务：

  registerUser(user): Observable<any> {
    return this.http
      .post(this.apiUrl + 'users', this.user, httpOptions)
      .pipe(catchError(this.handleError));
  }

  handleError(err) {
    if (err instanceof HttpErrorResponse) {
      // Server Side Error
      return throwError(err);
    } else {
      // Client Side Error
      return throwError(err);
    }
  }

提前谢谢！

Answer 1

在您的服务中，像这样设置请求，这将使您处理组件内的错误并停止在此处处理的错误。如果这里有错误，它将被传递到组件并由sub处理。

data[f'perc_{valor}'] = data.apply(lambda x: (x[f'{valor}'] / x[f'{valor}']/ data[f'{valor}'].sum())*100, axis = 1)
tps = data.pivot_table(values=f'perc_{valor}', index=colX, columns=colStacked, aggfunc='sum')

tps = tps.div(tps.sum(1), axis=0)
tps.plot(kind='bar', stacked=True, figsize=(20,10), title='Gráfico de Barras Empilhadas')

在您的组件中

registerUser(user): Observable<any> 
{
  return this.http.post(this.apiUrl + 'users', this.user, httpOptions)
    .pipe(map(data => data));
}

您可以在订阅的错误代码块中处理错误，也可以从此处调用一个函数，该函数具有处理错误的逻辑。

Answer 2

您也可以处理组件中的错误，subscribe具有三个回调函数：1。成功，2。错误，3。完成。像这样修改您的ngOnInit-

 ngOnInit() {
    this.orders = this.authService.registerUser().subscribe(response => {
       // success
    }, (err) => this.handleError(err), // error
    () => console.log('complete')); // complete

  }

如何处理Angular组件中的错误

2 个答案: