Question

在Angular js中真的找不到关于http拦截器的好文档。处理由ng-include驱动的错误时，我可以使用以下内容拦截responseError：

    app.config(function ($httpProvider) {
    $httpProvider.interceptors.push('templateInterceptor');
});

// register the interceptor as a service
app.factory('templateInterceptor', function($q) {
  return {
    'responseError': function(rejection) {
       var isTemplate = !!rejection.config.url.match(/^content/g);
       if (isTemplate) {
         // here we add error message, but how this message appesrs in the place of ng-include
         rejection.data = '<div><template-error url="\''+ (rejection.config.url) + '\'"><strong>Error from interceptor.</strong></template-error></div>';
         return rejection;
       } else {
         return $q.reject(rejection);
       }
    }
  }
});

此代码取自此问题how to catch angular ng-include error。我不明白，拦截器是如何工作的？他们必须返回什么？如何使用传递给rejection拦截器的responseError参数？在rejection data属性用于将错误消息包含在失败的ng-include指令的位置，这是如何工作的？

Answer 1

如果您致电$http，例如

$http(....).then(function(results) {
  // Success callback
}, function(error) {
  // Error callback
});

服务器响应错误，然后在运行成功或错误回调之前调用responseError拦截器。

如果最终拦截器返回任何不是promise的值，那么从调用代码的角度来看，$http的调用成功，并且将执行成功回调，传递在返回值中作为results参数
如果最终拦截器返回一个使用值解析的promise，那么类似于上面的情况，从调用代码的角度来看，对$http的调用是成功的，并且将执行成功回调，将已解析的值作为results参数传递。
如果最终拦截器返回一个被错误拒绝的承诺，那么从调用代码的角度来看，对$http的调用不成功，并执行错误回调，将被拒绝的错误作为error参数传递。

ngInclude指令会从成功调用data的结果中将$http键注入页面。 https://stackoverflow.com/a/20838764/1319998处的代码将$http中对ngInclude的错误调用转换为成功，并将错误消息的html作为结果中的data键。

在Angular js中混淆了$ http拦截器

1 个答案: