Typahead Autocomplete AJAX

Question

Ich versuche, die Bootstrap Autocomplete (Typeahead) Liste mit Daten von einem externen Web-Service, in diesem Fall "Wunderground Weather", aber es funktioniert nicht zu füllen.

Es ist in einem Fehler zurück, der "hasOwnProperty" sagt.

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 

<!-- Latest compiled and minified JavaScript --> 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> 

<script src="bootstrap-typeahead.js"></script> 

HTML

<div class="col-md-12"> 
    <h1>Search Dynamic Autocomplete using Bootstrap Typeahead JS</h1> 
    <input class="typeahead form-control" type="text"> 
</div> 

JQuery

$(".typeahead").typeahead({ 
    source: function (query,process) { 
       return process(autoCompleteWunderGround(query)) 
      } 
}); 


function autoCompleteWunderGround(query){ 
    var results = [] 
    $.ajax({ 
     url : "http://autocomplete.wunderground.com/aq?query=query", 
     dataType : "jsonp", 
     jsonp : "cb", 
     data : { 
     "query" : query, 
     "format" : "JSON", 
     }, 
     success : function(data) { 
      $.each(data.RESULTS, function(index, value){ 
       results.push(value.name) 
      }) 
     } 
    }); 

    return results; 

} 

Dank

Answer 1

ich glaube, das Problem bei der Rückkehr der Funktion autoCompleteWunderGround ist(). Ajax ist asynchron, daher wird die Rückgabe der Funktion vor dem Erfolg ausgeführt. Das Array führt dazu, dass es nie gefüllt wird. Sie können mit einer Rückruffunktion versuchen.