使用带有管道和地图的try catch进行角度错误处理答案

【问题标题】：Error handling in angular using try catch with pipe and map使用带有管道和地图的try catch进行角度错误处理
【发布时间】：2021-08-08 23:51:12
【问题描述】：

如何返回错误并将其发送到组件 ts 以便用户可以检测到错误是什么？下面的代码是一个登录功能。

我希望来自 API 的错误消息在组件 ts 处返回并将其显示为 angular material toast。

signIn(payload: signInRequestPayload): Observable<Account> {

try {
  return this.query({
    document: login_user
    payload,
  }).pipe(
    map((result: any) => {

      console.log(result);
      if (result.data.length) {
        return result.data[0] as Account;
         }
        throw Error("")
    })
  );
} catch (error) {
  throw Error(`Unable to retrieve user account`);
}

}

【问题讨论】：

删除try catch。这可能会有所帮助：rxjs.dev/api/operators/catchError
我收到一个错误“类型“订阅”缺少来自类型“可观察”的以下属性：_isScalar、源、运算符、提升和另外 6 个。当我将 try catch 替换为 catchError
你能展示你更新的代码吗？
我刚刚去掉了try catch，然后开始通过subscribe返回（带有catchError格式）

标签： angular error-handling rxjs observable try-catch

【解决方案1】：

我们可以在map 内部抛出错误，subscriber 可以处理错误。

signIn(payload: signInRequestPayload): Observable<Account> {
  return this.query({
    document: login_user,
    payload,
  }).pipe(
     map((result: any) => {
       if (result.data.length) {
         return result.data[0] as Account;
       } else {
         throw new Error('...');
       }
     });
  );
}

那么应该由订阅者来处理错误：

第一个回调函数用于成功，第二个回调用于错误场景。

signIn.subscribe(response => {/* successful response */}, error => {/* error response */});

【讨论】：

在哪里可以添加订阅？
谁在调用signIn 方法？我认为他们正在订阅它。