How to return value using $q in angular js?

Question

How can i return data using promise
Got error that successdata is not a function in my controller, i don't know what am i doing wrong. Do i miss something in my controller ? I observ by debug app response is coming in service but nothing is returning from it

 var module = angular.module('app', []);
module.service("webservice", function($http,$q) {

    return {
        callservice:function(method,url,_data){
            var deferred = $q.defer();
            var promise = deferred.promise;
            $http({
                method: method,
                url: App_Service_api+url,
                data: _data,
                headers: {'Content-Type': 'application/x-www-form-urlencoded'}
            }).
            success(function (data, status, headers, config) {
                if (data.success) {
                    deferred.resolve(data.message);
                    //return deferred.promise;
                    promise.successdata = function(fn) {
                        promise.then(fn);
                        return deferred.promise;
                    }
                }
                else {
                    deferred.reject("Plase Enter valid data.");
                    //return deferred.promise;
                    promise.errordata = function(fn) {
                        alert("error");
                        promise.then(null, fn);
                        return deferred.promise;
                    }
                }

            }).
            error(function(data, status, headers, config){
                deferred.reject("Plase Enter valid data.");
                //return deferred.promise;
                promise.errordata = function(fn) {
                    promise.then(null, fn);
                    return deferred.promise;
                }
            }); 

        }
    }
})

Here is my controller code

webservice.callservice('POST',App_Service_login,inputs).successdata(function(data){
                var alertPopup = $ionicPopup.alert({
                    title: 'Login Succesfull!',
                    template: 'Please check your credentials!'
                });
            })
                .errordata(function(data) {
                    var alertPopup = $ionicPopup.alert({
                        title: 'Login failed!',
                        template: 'Please check your credentials!'
                    });
                });

manzapanza · Accepted Answer · 2015-10-21 11:22:48Z

I refactored a bit your code. Sincerely I didn't understand why you are created the functions successdata and errordata. You could try something more simple like this:

Service:

module.service("webservice", function($http, $q) {
    return {
        callservice: function(method, url, _data){
            var deferred = $q.defer();
            $http({
                method: method,
                url: App_Service_api + url,
                data: _data,
                headers: {'Content-Type': 'application/x-www-form-urlencoded'}
            }).
            success(function (data, status, headers, config) {
                if (data.success) {
                    deferred.resolve(data.message);
                }
                else {
                    deferred.reject("Plase Enter valid data.");
                }
            }).
            error(function(data, status, headers, config){
                deferred.reject("Plase Enter valid data.");
            }); 
            return deferred.promise;
        }
    }
});

Controller:

webservice.callservice('POST', App_Service_login, inputs).then(function(dataMessage){
    console.log('dataMessage', dataMessage);
    var alertPopup = $ionicPopup.alert({
        title: 'Login Succesfull!',
        template: 'Please check your credentials!'
    });
})
.catch(function(errorMessage) {
    console.log('errorMessage', errorMessage);
    var alertPopup = $ionicPopup.alert({
        title: 'Login failed!',
        template: 'Please check your credentials!'
    });
});

UPDATE:

This service code should be improved with a little fix on the server side returning the correct http status code. With this change instead of returning the property data.success = false when there some validation Errors you should return Status 400 Bad Request and data.message = 'Please Enter valid data'. Doing so you should remove the property data.success from your response, the controller would remain the same, and your service become:

Service:

module.service("webservice", function($http, $q) {
    return {
        callservice: function(method, url, _data){
            return $http({
                method: method,
                url: App_Service_api + url,
                data: _data,
                headers: {'Content-Type': 'application/x-www-form-urlencoded'}
            });
        }
    }
});

From Angular $http doc:

A response status code between 200 and 299 is considered a success status and will result in the success callback being called. Note that if the response is a redirect, XMLHttpRequest will transparently follow it, meaning that the error callback will not be called for such responses.

André Kreienbring · Accepted Answer · 2015-10-19 13:27:09Z

0

Maybe I don't get your code right, but I think it is far to complicated. Simply do:

    success(function (data, status, headers, config) {
        if (data.success) {
            deferred.resolve(data.message);
        }else{
            deferred.reject(...)
        }

and:

webservice.callservice('POST',App_Service_login,inputs)
.then(function(data){
   var alertPopup = $ionicPopup.alert({..})
}, function(err){
  //errorhandling
});

answered Oct 19, 2015 at 13:27

André Kreienbring

2,50915 silver badges16 bronze badges

Comments

Icycool · Accepted Answer · 2015-10-19 13:45:44Z

$http itself is returning a promise, so there is no need to create a new deferrable there.

The whole thing can be simplified into:

var module = angular.module('app', []);
module.service("webservice", function($http,$q) {

    return {
        callservice:function(method,url,_data){
            return $http({
                method: method,
                url: App_Service_api+url,
                data: _data,
                headers: {'Content-Type': 'application/x-www-form-urlencoded'}
            }).
            then(function (response) {
                if (response.data.success) {
                    return data.message;
                }
                else {
                    $q.reject("Plase Enter valid data.");
                }
            }, function() {
                $q.reject("Plase Enter valid data.");
            }); 
        }
    }
});

Collectives™ on Stack Overflow

How to return value using $q in angular js?

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related