How to get result of an asynchronous request?

Good afternoon, Friends!

I have this problem always becomes a problem. I have input, when you enter I want to show from dropdown list data from two sources. The first source is taken from my database, the second source is the address of Yandex maps (Yandex autocomplete).

I wrote code that takes the text and searches from two sources. With the first source is no problem, and the second is a request for Yandex maps. Here is an example which causes angular http, and returns an array. Here it is:
<h4>Asynchronous results</h4>
 the <pre>Model: {{asyncSelected | json}}</pre>
 <input type="text" ng-model="asyncSelected" placeholder="Locations loaded via $http" uib-typeahead="address for address in getLocation($viewValue)" typeahead-loading="loadingLocations" typeahead-no-results="noResults" class="form-control">
 <i ng-show="loadingLocations" class="glyphicon glyphicon-refresh"></i>
 <div ng-show="noResults">
 <i class="glyphicon glyphicon-remove"></i> No Results Found
 </div>

// Any function returning a promise object can be used to load values asynchronously
 $scope.getLocation = function(val) {
 return $http.get('//maps.googleapis.com/maps/api/geocode/json', {
 params: {
 address: val,
 sensor: false
}
}).then(function(response){
 return response.data.results.map(function(item){
 return item.formatted_address;
});
});
 };


The first time I did the exact same, but in result I received not just an array and promis, and the array was already inside her.

In the end, I wrote the following code which still returns an empty array. In the logs it is evident that from the beginning, an empty array is returned, and only after that calls the function getLocations.

$scope.getTarifZones = function(val) {
 var result = [];
 var getLocations = function(value) {
 return $http.get('/api/locations', {
 params: {
 address: 'Kazakhstan Almaty '+value
}
}).then(function(response){
 var featureMember = response.data.response.GeoObjectCollection.featureMember;
featureMember.map(function(item){
 return {
 place item.GeoObject.name
 type: 'Address'
};
});

 var zones = _.filter($scope.order.client.places, function (place) {
 return place.place.address.indexOf(val) >=0;
 }).map(function (place) {
 place.place.type = 'zones';
 return place;
 }); 
 result = _.concat(zones, featureMember);

 console.log('locations ', result);
});
};
getLocations(val);
 return result;
 };
July 9th 19 at 13:28
1 answer
July 9th 19 at 13:30
Solution
Try this. Should return a promise which will return an array.

$scope.getTarifZones = function(val) {

 function getLocations(value) {
 var result = [];

 return $http.get('/api/locations', {
 params: {
 address: 'Kazakhstan Almaty '+value
}
}).then(function(response){
 var featureMember = response.data.response.GeoObjectCollection.featureMember;

featureMember.map(function(item){
 return {
 place item.GeoObject.name
 type: 'Address'
};
});

 var zones = _.filter($scope.order.client.places, function (place) {
 return place.place.address.indexOf(val) >=0;
 }).map(function (place) {
 place.place.type = 'zones';
 return place;
});

 result = _.concat(zones, featureMember);

 return result;
});
};

 return getLocations(val);
};
Thank you so much! Immediately helped, such as tablet ) - Burnice.Weber commented on July 9th 19 at 13:33
: class )) - Alysson_Gaylord commented on July 9th 19 at 13:36

Find more questions by tags AngularNode.jsComputer networksYandex.MapsAJAX