在哪里处理AngualrJS后端错误

时间:2018-11-19 15:06:28

标签: angularjs error-handling promise angular-promise

在审查AngularJS应用程序时,我感到很震惊,因为我真的不知道如何在Controller级别处理数据库中的错误。

我们有一个三层结构controller-> service-> rest

Rest服务处理对后端数据库的调用,并向中层服务返回承诺,该承诺在大多数情况下将其交给控制器

myController.js

myService.getdata().then(function (result) {
  $scope.data = result
})

myService.js

this,getdata = function () {
  return RestService.get('url/to/my/data')
}

RestService从后端API(通过hapi / Boom)愉快地返回错误,这些错误可以被myServicemyController捕获。我正在努力的是在服务而不是控制器中构造错误处理程序。

我在控制器中的最佳尝试如下:

  .then(function (result) {
    $scope.data = result
    // do something with the data
  })
  .catch(function (error) {
    console.error('data could not be loaded')
  })
  .finally(function () {
    // tidy up here
  })

我宁愿将错误处理移至服务中,但不确定控制器如何等待数据可供处理...

1 个答案:

答案 0 :(得分:0)

我想出的最好的办法是处理服务中的错误并创建其他承诺以发送回控制器:

this.getdata = function () {
  //returns the $q.resolve or $q.reject promises with customized data
  return RestService.get('url/to/my/data').then(function(response) {
    // format the data differently from response, etc.
    var _data = customProcessing(response.data);

    // you can even decide, on your own if there is an error
    // if(someCondition) { return $q.reject("Custom error"); }

    return $q.resolve(_data);
  }).catch(function(error) {
    // throw up a modal, etc.
    var _error = customProcessing(error);
    return $q.reject(_error);
  }).finally(function() {
    //to do
  });
}

此示例允许您的服务层充当中间件。它获取数据,然后在执行自己的功能后将控制权返回给控制器:

myService.getdata().then(function (data) {
  $scope.data = data;
}).catch(function(error) {
  //optional catch clause. I use it to stop loading spinners
  //or to show error message below a form
});

这是一个有效的示例:https://plnkr.co/edit/35zx59yHUJ1Zrf5LWp3W?p=preview