CODEWITHSUNDEEP
angularjsarraysasynchronous
ridoansaleh
ridoansaleh

Reputation: 624

How to get the return's value of asynchronous function?

I want to get the return's value of asynchronous function as an array when i console that function's name. What i got before was an object.

1) What i have wrote in my controller :

$scope.allBrands = function(){

      var brands = [];

      return BrandService.get().then(function(data) {

           angular.forEach(data, function(value, key) {
             return brands.push(value.name);
           });

           return brands;

     });
};

console.log($scope.allBrands());

2) The result of console.log($scope.allBrands()) :

f
      $$state: Object
        status: 1
        value: Array[33]
          0: "ALAIA"
          1: "ALBERTA FERRETTI"
          2: "Alessandra Rich"
          3: "Alexander Mcqueen"
          4: "Alexander Wang"
          5: "Alice + Olivia"
          6: "Amanda Wakeley"
          7: "Balenciaga"
          8: "Bcbg Maxazria"
          9: "Bcbg Maz Azria"
          10: "Biyan"
          11: "Burberry"
          12: "Calvin Klein"
          13: "Casadei"
          14: "Chanel"
          15: "Charlotte Olympia"
          16: "Chloe"
          17: "Christian Dior"
          18: "Dolce & Gabbana"
          19: "Emilia Wickstead"
          20: "Farah Khan"
          21: "Fendi"
          22: "Gucci"
          23: "Halston Heritage"
          24: "Herve Leger"
          25: "Lanvin"
          26: "Louis Leeman"
          27: "Mary Katrantzou"
          28: "Roberto Cavalli"
          29: "Sebastian Gunawan"
          30: "Self-Portrait"
          31: "Valentino"
          32: "Versace"
         length: 
        __proto__: Array[0]
       __proto__: Object
      __proto__: Object

3) The result i would like to achieve :

["ALAIA", "ALBERTA FERRETTI", "Alessandra Rich", "Alexander Mcqueen", "Alexander Wang", "Alice + Olivia", "Amanda Wakeley", "Balenciaga", "Bcbg Maxazria", "Bcbg Maz Azria", "Biyan", "Burberry", "Calvin Klein", "Casadei", "Chanel", "Charlotte Olympia", "Chloe", "Christian Dior", "Dolce & Gabbana", "Emilia Wickstead", "Farah Khan", "Fendi", "Gucci", "Halston Heritage", "Herve Leger", "Lanvin", "Louis Leeman", "Mary Katrantzou", "Roberto Cavalli", "Sebastian Gunawan", "Self-Portrait", "Valentino", "Versace"]

Can anyone point me out how should it be done ?

*EDIT

This is the solution :

$scope.allBrands = function(){    
   var brands = [];
   return BrandService.get().then(function(data) {      
       angular.forEach(data, function(value, key) {
           brands.push(value.name);
       });
       return brands;
   });
};

var promise = $scope.allBrands(); 

promise.then(function(result){
    console.log(result);
},
function(error){
    console.log(error);
});

Upvotes: 0

Views: 714

Answers (2)

Giancarlos
Giancarlos

Reputation: 151

You don't should return the promise, instead you can return a new array inside the resolve function:

$scope.allBrands = function(){
  BrandService.get().then(function(data) {
       return data.map(function(item) { return item.name })
  });
};

Upvotes: 0

Pankaj Parkar
Pankaj Parkar

Reputation: 136144

Asynchronous call doesn't work the way you are thinking(synchronous way). They doesn't return a value as soon as server you call them. You have to wait till server respond to request.

Over here as you did console.log the allBrands function which return promise object(seems like $resource promise), that is getting consoled. And you can see your response in the promise object as soon as it arrives. I'd say you should use .then over your promise object where you can just get a data returned from API.

$scope.allBrands().then(successCB(states){
   $scope.states = states;
   console.log(states);
}, errorCB(error){
   console.log(error)
})

Upvotes: 2

Related Questions