JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<script src="http://angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.10.0.min.js"></script>
<div ng-controller="TypeaheadCtrl">
<h4>Google Geocode</h4>
<pre>Адрес: {{asyncSelected | json}}</pre>
<input type="text" ng-model="asyncSelected" placeholder="Введите адрес" typeahead="address for address in getLocation($viewValue) | filter:$viewValue" typeahead-loading="loadingLocations" class="form-control">
<i ng-show="loadingLocations" class="glyphicon glyphicon-refresh"></i>
</div>
JavaScript
angular.module('typeaheadApp', ['ui.bootstrap']).controller('TypeaheadCtrl', ['$scope', '$http', function ($scope, $http) {
$scope.getLocation = function(val) {
return $http({method: 'POST', url: 'https://dadata.ru/api/v1/suggest/address', headers: {
'Authorization': 'Token bf69a05b6ce842dcd0cbc159648d19a8c49fdf33',
'Content-Type': 'application/json'
}, data: {
query: 'Москва ' + val
}}).then(function(data) {
console.log(data.data.suggestions);
var addresses = [];
angular.forEach(data.data.suggestions, function(item) {
addresses.push(item.value);
});
return addresses
});
};
}]);