2

我今天开始更加关注 angularJS，在我的项目中我需要地名。我想用这样的地名创建类似 jQuery UI 的自动完成功能。

一切都很好console.log，我得到了结果，但由于某种原因，我无法将它放到 typeahead 的下拉列表中。

范围

$scope.cities = function(cityName)
{
    return $http.jsonp("http://ws.geonames.org/searchJSON?callback=JSON_CALLBACK&q="+cityName+"&maxRows=6").success(function(data){
        $.map(data.geonames, function(item)
        {
            return item.name + (item.adminName1 ? ", " + item.adminName1 : "") + ", " + item.countryName;
        });
    });
};

输入

<input type="text" class="span4" ng-model="result" typeahead="suggestion for suggestion in cities($viewValue)">

我正在将UI Bootstrap用于 Angular js，并根据该示例进行了尝试，但出现了问题，请有人给我提示吗？

谢谢

4

1 回答 1

1

$http.jsonp异步执行请求，因此您在成功回调中所做的操作将丢失。

您可以使用$q.defer或 观察者（但显然后者不能正常工作typeahead）来应用成功回调中的值：

$scope.cities = function(cityName) 
{
    var dfr = $q.defer();

    $http.jsonp("http://ws.geonames.org/searchJSON?callback=JSON_CALLBACK&q="+cityName+"&maxRows=6").success(function(data){
        dfr.resolve($.map(data.geonames, function(item)
        {
            return item.name + (item.adminName1 ? ", " + item.adminName1 : "") + ", " + item.countryName;
        }));
    });

    return dfr.promise;
};

}

于 2013-06-18T07:53:39.970 回答