Question

根据thisPawełKozłowski的回答，来自AngularUI-Bootstrap的Typeahead应该可以在最新的Angular版本中使用$ resource异步获取弹出项目时工作（我使用的是1.2.X）。

Plunk - Paweł's version - Typeahead with $http

我想我不知道如何正确使用它（因此我在typeaheadHighlight指令的代码中出现错误 - typeahead会立即返回Resource作为字符串并轮胎突出显示它们）

我认为关键代码是：

$scope.cities = function(prefix) {
    var p = dataProviderService.lookup({q: prefix}).$promise;
    return p.then(function(response){
        $log.info('Got it!');
        return response.data;
    });
    return p;
};

我尝试了很多东西 - 返回$promise（来自Plunker的版本），query()，then()。
目前，我在我的应用中使用$http来实现此功能，我很满意。不过，只是想知道如何使用$resource实现相同的目标。

您可能需要查看此内容：https://github.com/angular/angular.js/commit/05772e15fbecfdc63d4977e2e8839d8b95d6a92d
ui.bootstrap.typeahead是否与$ resource的promise API中的更改兼容？

Answer 1

应该是：

$scope.cities = function(prefix) {
    return dataProviderService.lookup({q: prefix}).$promise.then(
      function(response){
        // might want to store them somewhere to process after selection..
        // $scope.cities = response.data;
        return response.data;
    });
};

这是基于上面提到的角度提交，它对Angular 1.2.13起作用

Answer 2

感谢@ andrew-lank的回答，我也用$ resource做了我的。我的回复中没有数据属性。我在$ resource上使用了查询方法，它需要一个数组的响应类型，这可能就是为什么没有数据属性。它是一个Resource对象数组，每个对象都包含数据。所以我的代码稍微简单一些，看起来更像是这样：

$scope.cities = function(prefix) {
    return dataProviderService.query({q: prefix}).$promise.then(
      function(response){
        return response;
    });
};

Answer 3

我遇到了同样的问题，它让我把头撞在墙上。问题在于数据服务，因为它返回一个字符串数组而不是将它们包装在JSON对象中。 $ resource不适用于字符串数组。

有关其他信息，请查看以下答案： One dimensional array of strings being parsed to 2d by angular resource

Answer 4

typeahead =“i在员工信息中的i.t_UserName | filter：$ viewValue | limitTo：4”
作为html输入的属性

并在您的控制器中（使用员工资源）

$ scope.employeeInfo = getEmployeeResourceSvc.getEmplInfo.query（function（response）{ $ scope.employeeInfo = response; }）;

Answer 5

在ui-bootstrap 13.0和angular 1.3中，您现在可以执行以下操作：

$scope.cities = function (q) {
    return $scope.resource.query({ q: prefix }).$promise
}

如何使用最新的$ resource填充Angular UI Bootstrap Typeahead

5 个答案: