如何使用Angular UI Typeahead与Parse API
How to Use Angular UI Typeahead with Parse API?
我想通过使用Parse API从远程数据库获取结果来实现Typeahead(自动完成)功能,我已经尝试按照以下方式实现它,我正在获取JSON数组,但无法将其显示为下拉列表。。。以下是我的代码
HTML
<input type="text"
ng-model="address.locality"
placeholder="Locality"
typeahead="locality for locality in getLocation($viewValue)"
typeahead-min-length="3"
typeahead-loading="isLoading"
typeahead-no-results="noResults"
class="form-control newAddressFields">
<i ng-show="isLoading" class="glyphicon glyphicon-refresh"></i>
<div ng-show="noResults">
<i class="glyphicon glyphicon-remove"></i> No Results Found
</div>
控制器
$scope.noResults = false;
$scope.localities = [];
$scope.isLoading = false;
$scope.getLocation = function(val) {
var filteredSearch= val.toLowerCase();
var city_lw = $scope.address.city.toLowerCase();
/* console.log(filteredSearch)*/;
var Mapping = Parse.Object.extend("COD_Area_List");
var localityQuery = new Parse.Query(Mapping);
localityQuery.startsWith("Locality_sm",filteredSearch);
localityQuery.equalTo("city_sm", city_lw);
$scope.localities = [];
$scope.isLoading = true;
localityQuery.find({
success: function(results) {
$scope.isLoading = false;
console.log("Successfully retrieved " + results.length + " responses.");
if(results.length > 0){
$scope.noResults = false;
for (var i = 0; i < results.length; i++) {
var object = results[i].toJSON();
/*console.log(object);*/
$scope.localities.push(object.Locality);
}
} else{
$scope.noResults = true;
}
console.log($scope.localities);
//This has results showing but not in the dropdown below Typeahead
return $scope.localities;
},
error: function(error) {
// There was an error.
$scope.isLoading = false;
}
});
};
在HTML中,您使用了
typeahead="locality for locality in getLocation($viewValue)"
在Controller$scope.locales中,您有一个包含Objects的数组。。因此,您可以在下拉列表中查看"对象"。。
解决问题的方法是在HTML中使用对象的属性。。
假设您的locality对象看起来像这样={city:"some_city",state:"some_state"}
所以试试这个。。
typeahead="locality.city for locality in getLocation($viewValue)"
相关文章:
- 关于Parse.com客户端共享应用程序;api密钥
- 如何使用API URL的JSON.parse将JSON字符串更改为Javascript对象
- parse.com javascript地理查询api中的withinFile错误
- nodejs JSON.parse() of stack overflow API
- AngularJS + Parse API 调用服务不受 userId 的约束
- Parse.com Javascript API Login
- 如何使用 REST API 将表单数据从 ionic 应用程序发送到 parse.com MBaaS
- 如何使用REST API在Parse.com中将日期列设置为NULL
- 使用Parse登录Facebook,但我得到--https://api.parse.com/1/users404--刷新
- Blogger JSON API Post fetch and Content Parse
- parse.com REST API,使用build.phonegap Javascript推送通知Android和iO
- Parse.comJavascript API,查询包含指针列表的对象列表
- 如何使用Angular UI Typeahead与Parse API
- Using PARSE REST API
- 使用Parse.com Javascript API,用户通过PHP API进行身份验证
- 如何通过REST api在Parse中批量创建用户
- 如何将Parse Javascript API与Appcelerator集成而不使用未记录的调用?
- 如何使用javascript API从Parse获取上传的图像
- 如何在Parse API中进行嵌套查询
- About Parse API Data