问题描述：

除了合理的后端错误处理外，还管理用AngularJS重写我的项目。AngularJS报告后端错误

我只希望有一种通用的方法来捕获Ajax错误响应并相应地修改范围。

jQuery中，我将做到以下几点：

设置一个元素（可以称之为ajaxRoot）关于Ajax设置

我会确保在后台发送的报头“显示错误消息“每个键与ajaxRoot下的元素名称匹配。例如

<div id="myAjaxSection"> 
    <span class="view-port"> 
      <input name="username"/> 
    </span> 
</div> 

$.ajax({ 
    ajaxRoot : $("#myAjaxSection"), 
    ... 
});

使用ajaxError捕捉所有的Ajax错误，看起来像

if (ajaxSettings.ajaxRoot && jqXHR.getResponseHeader("display-messages")){ 
    var msgs = JSON.parse(jqXHR.getResponseHeader("display-message")); 
    var $ajaxRoot = ajaxSettings.ajaxRoot; 
    var k; 
    for (k in msgs){ 
     $ajaxRoot.find("[name=" + k + "]").closest(".view-port").addClass("error").popover({content: msgs[k]}); 
    } 
}

这将轻松打理所有错误的假设，我决定在约定的任何页面上。

现在我试图达到与AngularJS类似的东西。这是我迄今为止所尝试的

http拦截器 - 但我无法访问范围。
http拦截器+发布/订阅事件 - 需要在每个控制器中重复代码。
$ http调用的错误处理程序 - 再次导致代码重复。

目前我卡住了。我需要指导如何继续？

编辑

我讨厌回答我自己的问题。

我现在有一个丑陋但合理的解决方案。希望能有更多关于这个话题的答案。

答

现在我的丑又合理的解决方案如下：

即使拦截器无法访问“$范围” - 他们可以访问“$ rootScope”。

注 - 当我调试拦截并试图评估“$ rootScope”我得到了一个“没有这样的引用”错误..这是奇怪的。一旦我使用“console.log”打印它，它运行良好。

下我的应用程序的配置，我会做

$httpProvider.responseInterceptors.push('myInterceptor');

然后我定义我的拦截如下

MyApp.factory('myInterceptor', function ($rootScope, $q, $window) 
{ 
    function success(response) 
    { 
     $rootScope.formErrors = {}; 
     return response; 
    } 

    function error(response) 
    { 
     var status = response.status; 
     if (status == 401) { 
      window.location = "/"; 
      return; 
     } 

     var hdrs = response.headers(); 
     if (hdrs["display-message"]){ 
      var displayMessages = JSON.parse(hdrs["display-message"]); 
      if (displayMessages["formErrors"]){ 
       $rootScope.formErrors = displayMessages["formErrors"]; 
      } 
     } 
     console.log(["hdrs",hdrs]); 
     // otherwise 
     return $q.reject(response); 
    } 

    return function (promise) 
    { 
     return promise.then(success, error); 
    }; 
});

现在所有这剩下的就是引用rootScope。从模板错误如此

<div id="myAjaxSection"> 
    <span class="view-port" ng-class="{'error':formErrors['username'] != null}"> 
      <input name="username"/> 
    </span> 
</div>

哪一个 - 感谢模板是可行的没有太多的代码重复。

<div id="myAjaxSection"> 
    <span class="view-port" ng-class="{'error':formErrors['@name'] != null}"> 
      <input name="@name"/> 
    </span> 
</div>

现在剩下的就是解决如何实现“弹出窗口” - 我确定某处存在什么东西。

我讨厌这个解决方案..感觉不对..如果有人有什么更好的建议 - 请做。

AngularJS报告后端错误

编辑

相关推荐