AngularJS: potrzeba wywoływania zdarzenia za każdym razem, gdy wywoływane jest wywołanie ajax

Question

Próbuję wywołać zdarzenie na $ rootScope za każdym razem, gdy wywoływane jest wywołanie ajax.

var App = angular.module('MyApp'); 

App.config(function ($httpProvider) { 
    //add a transformRequest to preprocess request 
    $httpProvider.defaults.transformRequest.push(function() { 
     //resolving $rootScope manually since it's not possible to resolve instances in config blocks 
     var $rootScope = angular.injector(['ng']).get('$rootScope'); 
     $rootScope.$broadcast('httpCallStarted'); 

     var $log = angular.injector(['ng']).get('$log'); 
     $log.log('httpCallStarted'); 
    }); 
}); 

Zdarzenie "httpCallStarted" nie jest uruchamiane. Podejrzewam, że nie jest właściwe używanie $ rootScope lub jakiejkolwiek innej usługi instancji w blokach konfiguracji. Jeśli tak, jak mogę uzyskać zdarzenie za każdym razem, gdy rozpoczyna się wywołanie http, bez konieczności przekazywania obiektu konfiguracyjnego za każdym razem, gdy wykonuję połączenie?

Z góry dziękuję

Answer 1

Zawsze można zawijać http w usłudze. Ponieważ usługi są konfigurowane tylko raz, możesz po prostu skonfigurować fabrykę usług dla ciebie. Czuję się trochę hackish do mnie, szczerze mówiąc, ale to dobra robota dookoła, ponieważ Angular nie ma globalnego sposobu, aby to zrobić jeszcze, chyba że coś jest dodane w 1.0.3, którego nie jestem świadomy.

Here's a plunker of it working

A oto kod:

app.factory('httpPreConfig', ['$http', '$rootScope', function($http, $rootScope) { 
    $http.defaults.transformRequest.push(function (data) { 
     $rootScope.$broadcast('httpCallStarted'); 
     return data; 
    }); 
    $http.defaults.transformResponse.push(function(data){ 
     $rootScope.$broadcast('httpCallStopped'); 
     return data; 
    }) 
    return $http; 
}]); 

app.controller('MainCtrl', function($scope, httpPreConfig) { 
    $scope.status = []; 

    $scope.$on('httpCallStarted', function(e) { 
    $scope.status.push('started'); 
    }); 
    $scope.$on('httpCallStopped', function(e) { 
    $scope.status.push('stopped'); 
    }); 

    $scope.sendGet = function(){ 
    httpPreConfig.get('test.json');  
    }; 
}); 

Answer 2

I sprawdzeniu, że ten kod zadziała zgodnie z oczekiwaniami. Jak wspomniałem powyżej, nie pobierasz wtryskiwacza, o którym myślisz, że jesteś i potrzebujesz pobrać ten, który jest używany w twojej aplikacji.

discussionApp.config(function($httpProvider) { 
    $httpProvider.defaults.transformRequest.push(function(data) { 
    var $injector, $log, $rootScope; 
    $injector = angular.element('#someid').injector(); 

    $rootScope = $injector.get('$rootScope'); 
    $rootScope.$broadcast('httpCallStarted'); 

    $log = $injector.get('$log'); 
    $log.log('httpCallStarted'); 
    return data; 
    }); 
}); 

Answer 3

Najlepszym sposobem na to jest użycie przechwytywacza HTTP. Sprawdź this link

Answer 4

Cagatay ma rację. Lepsze wykorzystanie $http przechwytujące:

app.config(function ($httpProvider, $provide) { 
    $provide.factory('httpInterceptor', function ($q, $rootScope) { 
     return { 
      'request': function (config) { 
       // intercept and change config: e.g. change the URL 
       // config.url += '?nocache=' + (new Date()).getTime(); 
       // broadcasting 'httpRequest' event 
       $rootScope.$broadcast('httpRequest', config); 
       return config || $q.when(config); 
      }, 
      'response': function (response) { 
       // we can intercept and change response here... 
       // broadcasting 'httpResponse' event 
       $rootScope.$broadcast('httpResponse', response); 
       return response || $q.when(response); 
      }, 
      'requestError': function (rejection) { 
       // broadcasting 'httpRequestError' event 
       $rootScope.$broadcast('httpRequestError', rejection); 
       return $q.reject(rejection); 
      }, 
      'responseError': function (rejection) { 
       // broadcasting 'httpResponseError' event 
       $rootScope.$broadcast('httpResponseError', rejection); 
       return $q.reject(rejection); 
      } 
     }; 
    }); 
    $httpProvider.interceptors.push('httpInterceptor'); 
}); 

myślę interceptors prace dla wersji po 1.1.x. Przed tą wersją był responseInterceptors.