AngularJS Interceptor TypeError: Nie można odczytać nagłówków właściwości o niezdefiniowanym

Question

Otrzymuję ten błąd z nieznanych przyczyn podczas próby wprowadzenia kodu ładującego AJAX Spinner.

Nie rozumiem, gdzie powinien zostać zdefiniowany nagłówek. Zrobiłem console.log(config), ale widzę tam wartość headers: accept: text/html.

Poniżej jest mój kod:

/** 
* Spinner Service 
*/ 

//Spinner Constants 
diary.constant('START_REQUEST','START_REQUEST'); 
diary.constant('END_REQUEST','END_REQUEST'); 

//Register the interceptor service 
diary.factory('ajaxInterceptor', ['$injector','START_REQUEST', 'END_REQUEST', function ($injector, START_REQUEST, END_REQUEST) { 
    var $http, 
    $rootScope, 
    myAjaxInterceptor = { 
     request: function (config) { 
      $http = $http || $injector.get('$http'); 
      if ($http.pendingRequests.length < 1) { 
       console.log(config); 
       $rootScope = $rootScope || $injector.get('$rootScope'); 
       $rootScope.$broadcast(START_REQUEST); 
      } 
     } 
    }; 

    return myAjaxInterceptor; 
}]); 

diary.config(['$httpProvider', function ($httpProvider) { 
    $httpProvider.interceptors.push('ajaxInterceptor'); 
}]); 

Answer 1

Tutaj masz pełną próbkę o tym, jak wdrożyć przy użyciu tarczy przechwytujących (owijanie $ rootScope w służbie dla lepszej czytelności kodu).

http://lemoncode.net/2013/07/31/angularjs-found-great-solution-to-display-ajax-spinner-loading-widget/

Jak podkreślił, to jest przestarzałe (mam zaktualizować POST), obecna struktura używam (uproszczony kod wewnętrzny). Myślę, że może być najlepiej zacząć od plunker, może to nie ma nic wspólnego ze sposobem tou są wykonawczego (pozwól mi szukać plunkr nasion)

myapp.factory('httpInterceptor', ['$q', '$injector', 
    function ($q, $injector) { 

    return { 
     'request': function(config) { 
     // request your $rootscope messaging should be here? 
     return config; 
     }, 

    'requestError': function(rejection) { 
     // request error your $rootscope messagin should be here? 
     return $q.reject(rejection); 
     }, 


     'response': function(response) { 
     // response your $rootscope messagin should be here? 

     return response; 
     }, 

    'responseError': function(rejection) { 
     // response error your $rootscope messagin should be here? 

     return $q.reject(rejection); 

     } 
    }; 
    } 
]); 

Answer 2

Chyba mam rozwiązanie.

Miałem ten sam problem w ramach projektu angularjs gdzie Interceptor jest dokładnie zdefiniowane takie same (https://docs.angularjs.org/api/ng/service/$http#interceptors)

Aby skrócić An połowów przy Interceptor config i musiał go zwrócić. I zapomniałeś.

Więc to byłoby:

request: function (config) { 
    $http = $http || $injector.get('$http'); 
    if ($http.pendingRequests.length < 1) { 
     $rootScope = $rootScope || $injector.get('$rootScope'); 
     $rootScope.$broadcast(START_REQUEST); 
    } 
    return config; 
}