javascript function not returns undefined value

Question

i'm having following angularjs function :

this.loadDocument = function() { 
                var documents = [];
                 alert("load documents"); 
                $http({
                     url: 'http://localhost:8085/api/jsonws/dlapp/get-file-entries/repository-id/10182/folder-id/0',
                     method: 'get',             
                     headers: {
                            "Authorization": this.makeAuth(this.username,this.password)
                     }
            }).success(
                    function(response) {
                        alert("sucess");                        
                        documents=response;
                    });
              return documents; 
         };

i called it from following code :

$scope.loadDocument = function() {
        $scope.documents=documentService.loadDocument();

    }

but return value from the function is undefined.because it returns value before success method of ajax call executing.

is there any solution?

Thanks in advance.

you can pass in a callback *for a reason.* Use this opportunity, and do your processing in the appropriate callback. — The Paramagnetic Croissant, Mar 19 '15 at 11:40
possible duplicate of [How to return the response from an asynchronous call?](http://stackoverflow.com/questions/14220321/how-to-return-the-response-from-an-asynchronous-call) — JJJ, Mar 19 '15 at 11:40

score 0 · Answer 1 · answered Mar 19 '15 at 12:18

You need to use promises.

this.loadDocument = function() { 

        return $http({
                     url: 'http://localhost:8085/api/jsonws/dlapp/get-file-entries/repository-id/10182/folder-id/0',
                     method: 'get',             
                     headers: {
                            "Authorization": this.makeAuth(this.username,this.password)
                     }
            }).then(
                    function(response) {
                       return response;
                    });
         };

The loadDocument() function now returns a promise which you can use in your controller to update $scope.documents only when the Ajax call completes.

 $scope.loadDocument = function() {
           documentService.loadDocument().then(
                 function(result){
                 $scope.documents= result;
           }); 
 }

Bazinga · Accepted Answer · 2015-03-19T14:45:23.627

-1

$http service of angular return a promise so you need to return promise like this:

this.loadDocument = function() {
    return $http({
        url: 'http://localhost:8085/api/jsonws/dlapp/get-file-entries/repository-id/10182/folder-id/0',
        method: 'get',
        headers: {
            "Authorization": this.makeAuth(this.username, this.password)
        }
    });

Then you call the promise and wait for success or fail:

    $scope.loadDocument = function() {
       documentService.loadDocument().then(function(response){
          //the promise success
          $scope.documents = response.data;
       }).catch(function(err) {
          //the promise failed
       })

 }

edited Mar 19 '15 at 14:45

answered Mar 19 '15 at 11:43

Bazinga

10,716
6
38
63

You should return the created promise (from $http service) at the end of `loadDocument` – Mohamed Shaaban Mar 19 '15 at 12:05
`return response;` line is completely useless and the comment there is wrong. `.success`, unlike `.then` is not chainable, so this line doesn't actually return anything - your `.success` is useless there. @NisargPujara – New Dev Mar 19 '15 at 13:38
@JsIsAwesome, good - you made a change. Now, just `return response.data` to get the actual `documents` payload. Let me know when you are done, and I'll remove the downvote. – New Dev Mar 19 '15 at 14:35
This is the shorter and best way. – Bazinga Mar 19 '15 at 14:45

javascript function not returns undefined value

2 Answers2