AngularJS Interceptor TypeError: Impossibile leggere le intestazioni della proprietà di undefined

Question

I get questo errore per motivi sconosciuti durante il tentativo di implementare un codice di caricamento AJAX Spinner.

Non capisco dove si debba definire l'intestazione. Ho fatto console.log(config) ma posso vedere il valore headers: accept: text/html lì.

Qui di seguito è il mio codice:

/** 
* 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

Qui si ha un esempio completo su come implementare un filatore tramite intercettori (avvolgendo il $ rootScope in un servizio per una migliore leggibilità del codice).

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

Come lei ha sottolineato, questo è deprecato (devo aggiornare il post), l'attuale struttura che sto utilizzando (semplificato codice interno). Credo che la migliore potrebbe essere quella di partire da un plunker, forse non ha nulla a che fare con il modo in cui stanno attuando tou (mi permetta di cercare un plunkr seme)

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

Credo di avere la soluzione.

Ho avuto lo stesso problema nell'ambito di un progetto AngularJS dove un intercettore è esattamente definito uguali ai suoi (https://docs.angularjs.org/api/ng/service/$http#interceptors)

di abbreviare, un fermo intercettore la configurazione e devono restituirlo. E ti sei dimenticato di

Quindi sarebbe:

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