AngularUI-Bootstrap的Typeahead不能读取‘unfined`的’`length`‘属性
AngularUI-Bootstrap的Typeahead不能读取‘unfined`的’`length`‘属性
提问于 2013-10-23 02:05:51
当我尝试使用promise从AngularUI-Bootstrap获取typeahead值时，我得到了以下错误。
TypeError: Cannot read property 'length' of undefined
at http://localhost:8000/static/js/ui-bootstrap-tpls-0.6.0.min.js:1:37982
at i (http://localhost:8000/static/js/angular.min.js:79:437)
at i (http://localhost:8000/static/js/angular.min.js:79:437)
at http://localhost:8000/static/js/angular.min.js:80:485
at Object.e.$eval (http://localhost:8000/static/js/angular.min.js:92:272)
at Object.e.$digest (http://localhost:8000/static/js/angular.min.js:90:142)
at Object.e.$apply (http://localhost:8000/static/js/angular.min.js:92:431)
at HTMLInputElement.Va.i (http://localhost:8000/static/js/angular.min.js:120:156)
at HTMLInputElement.x.event.dispatch (http://localhost:8000/static/js/jquery-1.10.2.min.js:5:14129)
at HTMLInputElement.v.handle (http://localhost:8000/static/js/jquery-1.10.2.min.js:5:10866) 我的HTML标签是：
<input type="text" class="form-control" id="guestName" ng-model="name" typeahead="name for name in getTypeaheadValues($viewValue)">使用我的getTypeaheadValues函数执行以下操作：
$scope.getTypeaheadValues = function($viewValue)
{
// return ['1','2','3','4'];
$http({
method: 'GET',
url: 'api/v1/person?name__icontains=' + $viewValue
}).error(function ($data) {
console.log("failed to fetch typeahead data");
}).success(function ($data) {
var output = [];
$data.objects.forEach(function (person)
{
output.push(person.name);
});
console.log(output);
return output;
});
}我不明白AngularUI-Bootstrap抱怨什么是未定义的。如果我删除最上面的return上的注释，这些值显示得很好。success中的console.log输出还返回我期望的数组中的所有值。
我错过了什么会导致AngularUI-Bootstrap看不到返回的数组？
回答 3
Stack Overflow用户
回答已采纳
发布于 2013-10-23 02:53:12
这个问题有两个方面。
第一个问题是我没有返回promise事件( $http调用)。缺少返回语句(正如@tobo指出的)是导致错误的直接原因。不过，我需要返回promise，而不是数组。
第二，我需要使用.then而不是.success for AngularUI-Bootstrap来获取结果。
我遇到了以下问题：How to tie angular-ui's typeahead with a server via $http for server side optimization?
它将我的函数调用更新为以下代码：
$scope.getTypeaheadValues = function($viewValue)
{
return $http({
method: 'GET',
url: 'api/v1/person?name__icontains=' + $viewValue
}).then(function ($response) {
var output = [];
console.log($data);
$response.data.objects.forEach(function (person)
{
output.push(person.name);
});
console.log(output);
return output;
});
}Stack Overflow用户
发布于 2013-10-23 02:29:34
$scope.getTypeaheadValues未返回任何数组。它返回null，因为您的return语句在回调函数“成功”中，这称为异步。
也许这能行得通：
$scope.getTypeaheadValues = function($viewValue)
{
var output = [];
$http({
method: 'GET',
url: 'api/v1/person?name__icontains=' + $viewValue
}).error(function ($data) {
console.log("failed to fetch typeahead data");
}).success(function ($data) {
$data.objects.forEach(function (person)
{
output.push(person.name);
});
console.log(output);
});
return output;
}Stack Overflow用户
发布于 2015-03-16 21:35:05
$scope.getTypeaheadValues = function($viewValue)
{
var someOutput="";//return something
$http({
method: 'GET',
url: 'api/v1/person?name__icontains=' + $viewValue
}).error(function (data) {
console.error(data);
}).success(function (data) {
console.log(data);//Do whatever you want
});
return someOutput;}
//缺少return语句
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/19525184
复制相关文章
相似问题
腾讯云开发者
