jsonp typeahead 不填充我的 uib-typeahead 表单元素答案

【问题标题】：jsonp typeahead not population my uib-typeahead form elementjsonp typeahead 不填充我的 uib-typeahead 表单元素
【发布时间】：2016-06-02 14:17:32
【问题描述】：

我一直在尝试使用工厂方法中的 jsonp 回调函数从 ui-bootstrap 模块 (https://angular-ui.github.io/bootstrap/) 填充 uib-typeahead。

这是我的工厂函数

autoCompleteCity: function(city){
            return $http.jsonp("http://gd.geobytes.com/AutoCompleteCity?callback=JSON_CALLBACK&filter=US&q="+city);
}

这是我的控制器

.controller('searchCtrl', function($scope, $rootScope, $http, owm, limitToFilter) {
    $scope.cities = function(cityName) {
        if(cityName.length > 2){
            owm.autoCompleteCity(cityName)
                .success(function(response){
                   return limitToFilter(response.data, 10);
                });
         }
     }

这是我的 HTML

      <input class="form-control" type="text" placeholder="City your seraching for" ng-model="result" uib-typeahead="suggestion for suggestion in cities($viewValue)" >

您可以想象 jsonp 回调工作正常并返回一个格式良好的数组。问题是 typeahead 表单元素现在不起作用。它似乎无法遍历数据（城市中的建议建议（$viewValue））。

任何想法。这似乎是一个范围问题，因为如果我在 success() 函数之外对一组名称进行硬编码，它就可以工作。

帮助，想法？

【问题讨论】：

标签： angularjs ajax angular-ui-bootstrap

【解决方案1】：

uib-typeahead 期望 resolved promise 作为结果。

看看这个帖子：angular.js ui + bootstrap typeahead + asynchronous call

而不是使用 IF 条件来检查名称长度。只有当 $viewValue > 2 像这样使用 typeahead-min-length 来调用城市更容易：

<input class="form-control" type="text" placeholder="City your seraching for" ng-model="result" typeahead-min-length="3" uib-typeahead="suggestion for suggestion in cities($viewValue)" >

你的控制器：

 .controller('searchCtrl', function($scope, $rootScope, $http, owm, limitToFilter) {
    $scope.cities = function(cityName) {
        return owm.autoCompleteCity(cityName)
            .then(function(response){
               return limitToFilter(response.data, 10);
            });
    }
}

【讨论】：