$http with promise not refresh on tab change

ionic-v1
1

I have a factory with $http call from the controller but as I re-call that $ http

    .factory('AleatoryPhotos', function($http, $q, $ionicLoading, $state) {


	var photos = null;
	
	var tags = null;
	
	var deferred = $q.defer();
	
	$ionicLoading.show({
		template: '<div class="loadinggif"></div>',
		noBackdrop: false
	});
	
	$http({
	
		method: 'POST',
		url: restServer,
		data: "funcion=" + "__getRandomImages&token=" + localStorage.getItem("token") + "&userId=" + localStorage.getItem("userId")  ,
		headers: {
			'Content-Type': 'application/x-www-form-urlencoded'
				 }
	}).success(function(data, status, headers, config) {
	
			
			
			if (data.resp == 'denied'){
				
				deferred.reject();
				
				localStorage.removeItem("token");
				
				localStorage.removeItem("userId");
				
				$ionicLoading.hide();
				
				$state.go('login');
				
				alert('Sesión iniciada en otro dispositivo');
				
				
				
			}else{
				
				
				deferred.resolve(data);
				photos = data;
				tags = data;
				$ionicLoading.hide();
				
				
			}
			
			
			
	}).error(function(data, status, headers, config) {
		
		
		$ionicLoading.hide();
		
		
		
	});
	
	
   
	return {
    all: function() {
    	
    	
      return deferred.promise;
    },
    get: function(idPost) {
      
      return photos[idPost];
    },
    gettags: function(idPost) {
      
      return tags[idPost];
    }
    
  }
  
})

in controller

AleatoryPhotos.all().then(function(d) {
	
	$scope.photos = d;
	
	$ionicLoading.hide();
});
2

Hi Sonictres, I experienced a similar behavior with an async call to websql. If the service was called from the view everything worked fine but when calling it on DOM load I got blank screen.
try adding $scope.$apply() to your success callback, it fixed for me.

\BR

3

Thanks @galindus but what happens is that no call back the $ http because it already has the promise

4

You can’t return the promise from the “all” property of your factory. It does not exist there. That bottom portion :

return {
    all: function() {


      return deferred.promise;
    },
    get: function(idPost) {

      return photos[idPost];
    },
    gettags: function(idPost) {

      return tags[idPost];
    }

  }

is the public API to your factory.

You need to wrap the http call in a function that returns a promise:

.factory('AleatoryPhotos', function($http, $q, $ionicLoading, $state) {

	var photos = null;
	var tags = null;

	var retrieve = function() {

		var deferred = $q.defer();

		$ionicLoading.show({
			template: '<div class="loadinggif"></div>',
			noBackdrop: false
		});

		$http({

			method: 'POST',
			url: restServer,
			data: "funcion=" + "__getRandomImages&token=" + localStorage.getItem("token") + "&userId=" + localStorage.getItem("userId")  ,
			headers: {
				'Content-Type': 'application/x-www-form-urlencoded'
					 }
		}).success(function(data, status, headers, config) {

				if (data.resp == 'denied'){

					deferred.reject();

					localStorage.removeItem("token");

					localStorage.removeItem("userId");

					$ionicLoading.hide();

					$state.go('login');

					alert('Sesión iniciada en otro dispositivo');



				}else{


					deferred.resolve(data);
					photos = data;
					tags = data;
					$ionicLoading.hide();


				}



		}).error(function(data, status, headers, config) {

			$ionicLoading.hide();

		});

		return deferred.promise;

	}


	return {

    all: retrieve,

    get: function(idPost) {

      return photos[idPost];

    },
    gettags: function(idPost) {

      return tags[idPost];

    }

  }

})
2 Likes
5

@Calendee Works Fine lot of thanks