A
A
Ayan Bai2016-05-18 09:36:45
JavaScript
Ayan Bai, 2016-05-18 09:36:45

How to get result from asynchronous request?

Good afternoon friends!

This task always turns into a problem for me. At me input, at input I want to show the data from two sources in the drop-down list. The first source is taken from my database, the second source is addresses from Yandex maps (Yandex autocomplete).

I wrote a code that takes text and searches from two sources. There are no problems with the first source, and the second is a request for Yandex maps. There is an example here that calls angular http and returns an array. There he is:

<h4>Asynchronous results</h4>
    <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 exactly the same, but as a result I got not just an array, but a promise, and the array itself was already inside it.

I ended up writing the following code, which still returns an empty array. The logs show that an empty array is returned from the beginning, and only after that the getLocations function is called.

$scope.getTarifZones = function(val) {
            var result = [];
            var getLocations = function(value) {
                return $http.get('/api/locations', {
                  params: {
                    address: 'Казахстан, Алматы, '+value
                  }
                }).then(function(response){
                    var featureMember = response.data.response.GeoObjectCollection.featureMember;
                    featureMember.map(function(item){
                        return {
                            place: item.GeoObject.name,
                            type: 'Адреса'
                        };
                    });

                    var zones =  _.filter($scope.order.client.places, function (place) {
                        return place.place.address.indexOf(val) >=0;
                    }).map(function (place) {
                        place.place.type = 'Тарифные зоны';
                        return place;
                    }); 
                    result = _.concat(zones, featureMember);

                    console.log('locations ', result);
                });
            };
            getLocations(val);
            return result;
        };

Answer the question

In order to leave comments, you need to log in

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question