Federick Jons Federick Jons - 1 year ago 79
AngularJS Question

Using custom spinner function on loading data

I bougth a template a few weeks ago.

The problem is that when the server returns 404 or 401 the spinner ($ionicLoading) never hide.

I found a .js file that hide the spinner if happens a error or something like that called "spinner.js"

spinner.js

(function() {
'use strict';

angular
.module('restaurant')
.config(function($httpProvider) {
$httpProvider.interceptors.push(function($rootScope, $q) {
return {
request: function(config) {
$rootScope.$broadcast('loading:show');
return config;
},
response: function(response) {
$rootScope.$broadcast('loading:hide');
return response;
},
requestError: function(rejectReason) {
debugger;
$rootScope.$broadcast('loading:hide');
return $q.reject(rejectReason);
}
};
});
})
.run(function($rootScope, $ionicLoading) {
$rootScope.$on('loading:show', function() {
$ionicLoading.show({});
});

$rootScope.$on('loading:hide', function() {
debugger;
$ionicLoading.hide();
});
});
})();


I put some debugger into this script, but never called when I request data to my server. How can I integrate this script into my controller? Or I have to put it into app.js?

Thanks!

Answer Source

It seems that you are missing responseError in your code.The 400 and 401 returns from the server is categorised as responseError.

return {
    request: function(config) {
        $rootScope.$broadcast('loading:show');
        return config;
    },
    response: function(response) {
        $rootScope.$broadcast('loading:hide');
        return response;
    },
    requestError: function(rejectReason) {
        $rootScope.$broadcast('loading:hide');
        return $q.reject(rejectReason);
    },
    responseError: function(rejectReason) {
        $rootScope.$broadcast('loading:hide');
        return $q.reject(rejectReason);
    }
};