javascript - Ionc解析服务添加加载事件

Question

我创建 ionic 移动应用程序，所有后端都使用解析数据库，我的代码工作正常，然后我想将 ionic ($ionicLoading)事件添加到我的解析REST API服务中，以显示加载一些东西以减慢互联网连接，这是我的代码-

angular.module('eventApp.services',[]).factory('eventApi',['$http','PARSE_CREDENTIALS',function($http,PARSE_CREDENTIALS){
    return {
            getAll:function()
            {
                return $http.get('https://api.parse.com/1/classes/Event',{
                    headers:{
                        'X-Parse-Application-Id': PARSE_CREDENTIALS.APP_ID,
                        'X-Parse-REST-API-Key':PARSE_CREDENTIALS.REST_API_KEY,
                    }
                 }
                );

            },

            get:function(id){
                return $http.get('https://api.parse.com/1/classes/Event/'+id,{
                    headers:{
                        'X-Parse-Application-Id': PARSE_CREDENTIALS.APP_ID,
                        'X-Parse-REST-API-Key':PARSE_CREDENTIALS.REST_API_KEY,
                    }
                });
            },
            create:function(data){
                return $http.post('https://api.parse.com/1/classes/Event',data,{
                    headers:{
                        'X-Parse-Application-Id': PARSE_CREDENTIALS.APP_ID,
                        'X-Parse-REST-API-Key':PARSE_CREDENTIALS.REST_API_KEY,
                        'Content-Type':'application/json'
                    }
                });
            },
            edit:function(id,data){
                return $http.put('https://api.parse.com/1/classes/Event/'+id,data,{
                    headers:{
                        'X-Parse-Application-Id': PARSE_CREDENTIALS.APP_ID,
                        'X-Parse-REST-API-Key':PARSE_CREDENTIALS.REST_API_KEY,
                        'Content-Type':'application/json'
                    }
                });
            },
            delete:function(id){
                return $http.delete('https://api.parse.com/1/classes/Event/'+id,{
                    headers:{
                        'X-Parse-Application-Id': PARSE_CREDENTIALS.APP_ID,
                        'X-Parse-REST-API-Key':PARSE_CREDENTIALS.REST_API_KEY,
                        'Content-Type':'application/json'
                    }
                });
            },

            getAllSP:function()
            {
                return $http.get('https://api.parse.com/1/classes/Speakers',{
                        headers:{
                            'X-Parse-Application-Id': PARSE_CREDENTIALS.APP_ID,
                            'X-Parse-REST-API-Key':PARSE_CREDENTIALS.REST_API_KEY,
                        }
                    }
                );
            },

            getSP:function(id)
            {
                return $http.get('https://api.parse.com/1/classes/Speakers/'+id,{
                        headers:{
                            'X-Parse-Application-Id': PARSE_CREDENTIALS.APP_ID,
                            'X-Parse-REST-API-Key':PARSE_CREDENTIALS.REST_API_KEY,
                        }
                    }
                );
            },
    }
}]).value('PARSE_CREDENTIALS',{
    APP_ID: 'xxx',
    REST_API_KEY:'xxx'
});

如何更改此代码以添加 ionicLoading？

Answer 1

更好地使用拦截器，请阅读here

app.config(function($httpProvider) {
  $httpProvider.interceptors.push(function($rootScope) {
    return {
      request: function(config) {
        $rootScope.$broadcast('loading:show')
        return config
      },
      response: function(response) {
        $rootScope.$broadcast('loading:hide')
        return response
      }
    }
  })
})

app.run(function($rootScope, $ionicLoading) {
  $rootScope.$on('loading:show', function() {
    $ionicLoading.show({template: 'foo'})
  })

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

但仍然是肮脏的解决方案，强烈建议使用第一个

angular.module('eventApp.services',[]).factory('eventApi',['$http','PARSE_CREDENTIALS', '$ionicLoading', '$q', 'function($http,PARSE_CREDENTIALS, $ionicLoading, $q){
    return {
            getAll:function()
            {
                var defer = $q.defer();
                $ionicLoading.show({
                     template: 'Loading...'
                });
                $http.get('https://api.parse.com/1/classes/Event',{
                    headers:{
                        'X-Parse-Application-Id': PARSE_CREDENTIALS.APP_ID,
                        'X-Parse-REST-API-Key':PARSE_CREDENTIALS.REST_API_KEY,
                    }
                 }).then(function(successResponse){
                       defer.resolve(successResponse);
                    }, function(errorResponse){
                       defer.reject(errorResponse);
                 }).finally(function(){
                     $ionicLoading.hide();
                 });
                 return defer.promise;
            }
            //other methods
    }
}]).value('PARSE_CREDENTIALS',{
    APP_ID: 'xxx',
    REST_API_KEY:'xxx'
});