大佬教程收集整理的这篇文章主要介绍了angularstrap typeahead 处理异步数据，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。
使用angularstrap typeahead 的时候下拉列表总是比输入的数据慢一步，注意下你的代码
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" type="text/css" /> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.14/angular.min.js"></script> <script src="//mgcrea.github.io/angular-strap/dist/angular-strap.js" data-semver="v2.1.3"></script> <script src="//mgcrea.github.io/angular-strap/dist/angular-strap.tpl.js" data-semver="v2.1.3"></script> <body ng-app="app"> <div ng-controller="firstCtrl"> <div class="form-group"> <label><i class="fa fa-home"></i> Address <small>(async via maps.googleapis.com)</small> </label> <input type="text" class="form-control" ng-model="SELEctedAddress" data-animation="am-flip-x" ng-options="address.formatted_address as address.formatted_address for address in getAddress($viewvalue)" placeholder="Enter address" bs-typeahead> </div> </div> </body>
var app = angular.module('app',['mgcrea.ngStrap']);
app.controller('firstCtrl',function($scope,$http) {
$scope.getAddress = function(viewvalue) {
var params = {
address: viewValue,sensor: false
};
return $http.get('http://maps.googleapis.com/maps/api/geocode/json',{
params: params
})
.then(function(res) {
return res.data.results;
});
};
});
需要注意数据源使用
getAddress($viewvalue)
处理请求使用
then
监听选中列表的事件，加在你自己的控制器里即可
$scope.$on('$typeahead.SELEct',function(value,indeX) {
console.log(value);
console.log(indeX);
}
以上是大佬教程为你收集整理的angularstrap typeahead 处理异步数据全部内容，希望文章能够帮你解决angularstrap typeahead 处理异步数据所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。