CODEWITHSUNDEEP
javascriptrestservice
Michael Tot Korsgaard
Michael Tot Korsgaard

Reputation: 4014

How to force a wait onto a REST Api in javascript

I want to call a REST Api and then do some code. How would I do this?

I'm having this javascript code:

angular.module('academiaUnitateApp')
    .factory('languageService',function($http, entryService){
        var service = {};

        /**
        *   Finds and all languages.
        *   
        *   @return {{ list of languages }}
        */
        service.findAll = function(callback){
            $http.get('/api/languages')
                .success(callback);
        };

        /**
        *   Finds and return all languages which there currently is no translations for.
        *   
        *   @param  {{ entry object }}  e
        *   @return {{ list of languages }}
        */
        service.findAllNotTranslated = function(e, callback){
            var noMatch = true,
                translations = [],
                notTranslated = [],
                allLanguages = [];

            // Find all languages in the database
            service.findAll(function(data){
                allLanguages = data;
                console.log('allLanguages : ', allLanguages);
            });

            // Find all translation of the entry
            for(var i = 0; i < e.title.length; i++){
                translations.push(e.title[i].language);
            }
            console.log('existing translations : ', translations);

            console.log('allLanguages lenght : ', allLanguages.length); 
            // Find all languages which is not already translated
            for(var i = 0; i < allLanguages.length; i++){
                console.log('i : ', i);

                //  Don't add translated languages
                for(var x = 0; x < translations.length; x++) {
                    if(allLanguages[i]._id === translations[x]){
                        console.log('found : ', translations[x]);
                        noMatch = false;
                    }
                }

                //  Add non-translated languages
                if(noMatch){
                    console.log('pushed : ', allLanguages[i]);
                    notTranslated.push(allLanguages[i]);
                }

                noMatch = true;
            }

            console.log('return : ', notTranslated);
            return notTranslated;
        };

        return service;
  });


I'm getting this output in my console which tells me that the service.findAll finishes after my code have run:

existing translations :  [
    "5501b9263c725a5005e4e78f", 
    "552d30aed6708cbc742e5efc"
]

allLanguages lenght :  0

return :  []

allLanguages :  [
    {
        Object_id: "5501b9263c725a5005e4e78f"
        name: "english"
    },
    { 
        Object_id: "552d3098d6708cbc742e5efb"
        name: "deutsch"
    },
    {
        Object_id: "552d30aed6708cbc742e5efc"
        name: "dansk"
    }
]


Is there a way to wait for the result and then do the rest of the code?

Upvotes: 0

Views: 847

Answers (1)

djna
djna

Reputation: 55907

move all your processing code into the callback

  service.findAll(function(data){
            allLanguages = data;
            console.log('allLanguages : ', allLanguages);

            // PUT THE CODE HERE
        });

Or refactor into a method you call from there.

Longer term explore the use of promises. You have effectively translated a promise into a callback here

service.findAll = function(callback){
        $http.get('/api/languages')
            .success(callback);
    };

You could instead write

  service.findAll = function(callback){
        return $http.get('/api/languages');               
    };

and then just call your processing function;

  service.findAll.then(myProcessingFunction);

Generally speaking callback processing is clumsier than working with promises. Nice tutorial here.

Upvotes: 1

Related Questions