How to execute a function after Angularjs perform all get/post requests?

Asked

Viewed 1,014 times

0

I need to call a Function after all get/post requests are completed. Note: I cannot call this function several times!

        angular
        .module('app.services')
        .config(InterceptorConfig)
        .service('InterceptorService', InterceptorService);

    function InterceptorConfig($httpProvider) {
        $httpProvider.interceptors.push('InterceptorService');
    }

    InterceptorService.$inject = ['$q', '$rootScope', 'Constants'];

    function InterceptorService($q, $rootScope, Constants) {
      return {
        request: function(config) {
            ##########################

            NÃO POSSO CHAMAR AQUI  

            ########################## 
            if (config.method === 'POST' && !config.file) {
                config.headers["Content-Type"] = "application/json";
            }

            if (!config.notloader) {
                $rootScope.$broadcast("loader_show");
            }
            return config || $q.when(config);
        }

2 answers

1

You can use the return in "Success" to execute something in case of success or even load an error with the return "error" of an http call. Follow the simple example:

$http.get('').success(functional(retorno){
  //Faz algo caso de sucesso
}).error(function(msg){
  //Escreve o erro
});
});

0

You can use events to send a "loading:finished" event, for example, and put a $Scope into a Controller or Directive "listening/Listening" that event and run when the event happens.

angular.module('app.services').factory('InterceptorService', ['$q', '$rootScope',
    function ($q, $rootScope) {
        var loadingCount = 0;

        return {
            request: function (config) {
                if (++loadingCount === 1) $rootScope.$broadcast('carregando:andamento');
                return config || $q.when(config);
            },

            response: function (response) {
                if(--loadingCount === 0) $rootScope.$broadcast('carregando:finalizado');
                return response || $q.when(response); 
            },

            responseError: function (response) {
                if(--loadingCount === 0) $rootScope.$broadcast('carregando:erro');
                return $q.reject(response);
            }
        };
     }
 ]).config(['$httpProvider', function ($httpProvider) {
     $httpProvider.interceptors.push('InterceptorService');
}]);

Example using a Directive:

.directive("loader", function ($rootScope) {
    return function ($scope, element, attrs) {
        $scope.$on("carregando:finalizado", function () {
            // chamar uma function aqui - todas requisições get/post foram finalizadas
        });
    };
});

Using a Controller

$scope.$on('carregando:finalizado', function (){
     // chamar uma function aqui - todas requisições get/post foram finalizadas
});
  • Or Voce can create a very simple Directive that just Listen through that event and calls the function you need. Ai Voce places this Directive in the header or footer.

  • if(-loadingCount === 0) $rootScope. $broadcast('loading:finalized'); passes more than once still.

  • I understood very well its solution, I had already tried it and I went through the same problem, the fact of being async.

  • @Maxferreira If all the requirements are part of the same Service Voce could use Promises ($q). I answered a similar question here http://stackoverflow.com/a/18674913/1310945

Browser other questions tagged

You are not signed in. Login or sign up in order to post.