AngularUI-Bootstrap的Typeahead无法读取`undefined`的`length`属性

Question

当我尝试使用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这些值显示正常.该console.log输出success也全部归还我期待在数组中的值.

我错过了什么会导致AngularUI-Bootstrap看不到返回的数组？

Answer 1

这个问题有两个问题.

首先是我没有返回promise事件($http电话).缺少return语句(如@tobo指出的那样)是直接导致错误的原因.我需要返回承诺,而不是数组.

第二个是我需要使用.then而不是.successAngularUI-Bootstrap来获取结果.

我遇到了以下问题: 如何通过$ http为服务器端优化将angular-ui的typeahead与服务器联系起来？

哪个更新了我的函数调用如下:

$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;
    });
}