从 Angular 组件中的服务捕获承诺中的错误

Question

大家好，我在 angular 中创建的邮政服务遇到了问题。当我调用服务时，努力从我的组件中捕获错误。我能够从服务中捕获错误，但我需要从我的组件中执行此操作以正确处理错误。任何建议将不胜感激。

服务

sendData(obj) {
 let promise = new Promise((resolve) => {
   this.http.post(this.URL, obj, this.httpOptions)
     .toPromise()
     .then(
      res => {
        console.log(res);
        resolve(res);
      }
     )
     //.catch((err) => { 
     //  console.log(err);
     //  throw err;
     //});
   });
  return promise;
}

成分

this._myservice.sendData(this.myobj)
  .then(function (res) {
    console.log('data sent');
  })
  .catch(error => {
      console.warn('from component:', error);
      // this console warn never gets logged out
  });

我是否需要更新我的服务中的某些内容以允许我从组件中捕获错误？

Answer 1

你在Promise这里创建你自己的，但reject如果Promise你正在包装 拒绝（抛出错误），你永远不会调用。这就是所谓的的new Promise反模式。在您的情况下，您可以简单地删除此包装器并将调用替换为resolveareturn以实现您的需要，如下所示：

sendData(obj) {
    return this.http.post(this.URL, obj, this.httpOptions)
        .toPromise()
        .then(res => {
            console.log(res);
            return res;
        });
}

为了提供更多的背景，你可以修复致电原来的问题reject。这看起来像这样：

// DONT'T DO THIS
sendData(obj) {
   let promise = new Promise((resolve, reject) => {
       this.http.post(this.URL, obj, this.httpOptions)
           .toPromise()
           .then(res => {
               console.log(res);
               resolve(res);
            })
            .catch((err) => { 
                console.log(err);
                reject(err); // Here.
            });
        });
    return promise;
}

但是，正如我上面所说，这是过于复杂和不必要的。我希望它展示了Promise您的组件如何访问永远不会看到 HTTP 调用中发生的错误。