/ / ¿Cómo usar typeahead en angularjs? - angularjs

¿Cómo usar typeahead en angularjs? - angularjs

Estoy tratando de hacer un autocompletado en el cual los datos se toman de url. He escrito un código pero se muestra indefinido. Puede alguien ayudarme a resolver este problema

//html file
<!DOCTYPE html>
<html ng-app="myapp">
<head>
<meta charset="utf-8">
<title>Autocomplete using remote searching</title>

<script src="angularfiles/angular.min.js"></script>
<script src="angularfiles/angular-animate.js"></script>
<script src="angularfiles/ui-bootstrap-tpls-0.13.4.js"></script>
<link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap-combined.min.css" rel="stylesheet">
<script src="Jsfiles/autourl.js"></script>
</head>
<body ng-controller="controller">
<div class="ui-widget">
<input type="text" ng-model="asyncselected" typeahead="r.city for r in getlist($viewValue)" typeahead-loading="loadingLocations" typeahead-no-results="noResults">
<i ng-show="loadingLocations" class="glyphicon glyphicon-refresh"></i>
<div ng-show="noResults">
<i class="glyphicon glyphicon-remove"></i> No Results Found
</div>
</div>
</body>
</html>

//Js file

var app=angular.module("myapp",["ui.bootstrap"]);
app.controller("controller",["$scope","$http",function($scope,$http){
$scope.getlist=function(val){
return $http.get("http://www.w3schools.com/angular/customers.php").then(function(response){
return response.data.results.map(function(item){
return item.City;
});
});
};
}]);

Puede ser que el código jsfile sea incorrecto ... No puedo identificarlo. ¿Puede alguien ayudarme a resolverlo?

Respuestas

0 para la respuesta № 1

Puede utilizar una directiva AngularUI. Es un buen enfoque y lo uso.

https://angular-ui.github.io/bootstrap/