如何在 angular js 中为服务器错误和成功编写全局函数

Question

我有一个单独的功能，如提交、更新、删除。对于所有函数

$http[method](url)
   .then(function(response) {
           $scope.successMessage = true;
} , function(response) {
          $scope.errorMessageWrong=true;
});

html

<p ng-show="successMessage">Success</p>
<p ng-show="errorMessageWrong"> Something went wrong </p>

用于单独的功能。我需要显示相应的消息。但我不想重复更新、删除和提交的代码，甚至不想重复执行相同操作的其他页面的代码。如何创建名为 errorHandler 之类的函数。这样我就可以重用它。
谁能帮帮我

Answer 1

您可以为此使用服务并在各种控制器中共享。 $http 也是一种服务。但是如果你想向数据添加更多内容，你可以创建一个新服务并将 $http 注入它。

Answer 2

how to create function called errorHandler or something. so that i can reuse it.

创建 chainable 承诺，通过返回完成的数据响应和 throwing 拒绝的错误响应。

下面的示例函数将 httpPromise 作为参数，将成功或错误消息放在 $scope 上，returns 适合链接的承诺。

function errorHandler(httpPromise) {
    var derivedPromise = httpPromise
       .then(function onFulfilled(response) {
                 $scope.successMessage = true;
                 //return response for chaining
                 return response;
            },
            function onRejected(errorResponse) {
                 $scope.errorMessageWrong = true;
                 //throw error to chain rejection
                 throw errorResponse;
            });
    //return derivedPromise for chaining
    return derivedResponse;
};

然后在客户端代码中：

var httpPromise = $http[method](url);

errorHandler(httpPromise).then( function (response) {
    //use data
});

客户端代码保存来自 $http 服务调用的 httpPromise，使用 errorHandler 函数处理承诺，并使用 errorHandler 函数返回的派生承诺。

因为调用承诺的 then 方法 returns 一个新的派生承诺，很容易创建承诺链。可以创建任意长度的链，并且由于一个 promise 可以用另一个 promise 解决（这将进一步延迟其解决），因此可以 pause/defer 在链中的任何点解决 promise。这使得实现强大的 API 成为可能。¹

Answer 3

如果您希望它在您的应用程序中是全局的，那么您可以使用 httpInterceptor。

您必须创建拦截器服务，然后将拦截器添加到 app.config() 中的 $httpProvider。

创建拦截器服务：

angular.module('app').factory('myInterceptorService', myInterceptorService);

function myInterceptorService($q){
   var errorMessage;
   var bShowHideWatchFlag;
   return{
       requestError:  requestError,
       responseError:  responseError,
       showFlag: bShowFlag,
       errorMessage: errorMessage
  };
  function requestError(rejection){
       errorMesasge = 'Request error';
       bShowHideWatchFlag = true;
       $q.reject(rejection);
       return;
  }
  function responseError(rejection){
       errorMesasge = 'Response error';
       bShowHideWatchFlag = true;
       $q.reject(rejection);
       return;
  }
}

要注册应用程序配置，请将 $httpProvider 添加到 app.config

app.config([...,'$httpProvider'...){
    $httpProvider.interceptor.push('myInterceptorService');
}

在您的控制器中，您必须将手表绑定到服务 showFlag：

  $scope.$watch( function () { return myInterceptorService.showFlag; },        
    function (oldval,newval) {
       if( oldval!=newval){
            $scope.errorMessage = myInterceptorService.errroMessage;
            $scope.showMessage  = newval;
        }
}, true);

如何在 angular js 中为服务器错误和成功编写全局函数

How to write global function for server error and success in angular js

javascript

global

angularjs

server