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

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

本文关键字：成功 错误 函数 全局 服务器 js      更新时间：2023-09-26

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

$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或其他东西的函数。这样我就可以重复使用它。
谁能帮我

如何创建名为errorHandler或其他东西的函数。 这样我就可以重用它。

通过返回已履行的数据响应并抛出被拒绝的错误响应来创建可链接的承诺。

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

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 函数返回的派生承诺。

由于调用 promise 的 then 方法会返回新的派生承诺，因此可以轻松创建承诺链。可以创建任意长度的链，并且由于一个承诺可以用另一个承诺来解决(这将进一步推迟其解决(，因此可以在链中的任何点暂停/推迟承诺的解决。这使得实现强大的 API 成为可能。1

如果您希望它对您的应用程序全局化，则可以使用 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);

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

相关文章：