Difference between success,then along with resolve, promise,http in angularjs

Question

In jquery when we fire ajax call ,when its successful,success function is called but, now in angular I have seen people using then as well as success.After googling a bit i found that then returns a promise. If i want to load a route which has data that comes from a service I use resolve to execute http req before binding data into template but here in http I have used neither success/then.

My http request part :

movieserviceObj.getlist=function(){ 
  return 
      $http({ url:'app/api/entertainment.php',data:$.param(dataString),method:'POST'});

Resolve part in config:

 resolve:{movieslist:moviesController.getallMovies}

Controller :

var moviesController=app.controller('moviesController',function($scope,movieslist){
$scope.movies=movieslist.data.result 
});

moviesController.getallMovies=function($q,$timeout,movieservice)
{
var defer=$q.defer();

$timeout(function(){
    defer.resolve(movieservice.getlist());
},1000);

return defer.promise;
}

Now above code works completely fine but data-binding occurs after 1 sec as set in $timeout.My issue is that http request gets data within 1 sec, but then too I have to wait for 1sec.Is there any way,that as soon http req is completed it should return promise to resolve till then show loading bar ? Here in http i have not used success / then so how it works.Also even after successful http request how can I make sure that it has key named 'status' in response set to true, if true then only resolve or reject.

score 1 · Answer 1 · edited May 23 '17 at 12:22

$http already returns a promise, so using then() makes much more sense here because:

you won't need to wait 1s every time
you won't risk not getting the data if the requests takes longer than 1s

Here's an example:

var moviesController = app.controller('moviesController',function($scope, movieservice){
    movieservice.getlist().then(function(res){
        $scope.movies = res.data;
    }, function(err){
        console.log('error:', err);
    });
})

});

There are some nice point about the actual differences between then and success here: Angular HttpPromise: difference between `success`/`error` methods and `then`'s arguments.

Also even after successful http request how can I make sure that it has key named 'status' in response set to true, if true then only resolve or reject.

You'd have to modify your service to do that, similar to what you were doing in a controller:

movieserviceObj.getlist=function(){ 
    var defer=$q.defer();
    $http({
        url:'app/api/entertainment.php',
        data:$.param(dataString),
        method:'POST'
    }).then(function(res){
        if (res.status === true) {
            defer.resolve(res);
        }
        else {
            defer.reject({error: 'Status not true'});
        }
    }, function(err) {
        defer.reject(err);
    })

    return defer.promise;
}

Info about route resolve:

An optional map of dependencies which should be injected into the controller. If any of these dependencies are promises, the router will wait for them all to be resolved or one to be rejected before the controller is instantiated. If all the promises are resolved successfully, the values of the resolved promises are injected and $routeChangeSuccess event is fired. If any of the promises are rejected the $routeChangeError event is fired.

Difference between success,then along with resolve, promise,http in angularjs

1 Answers1