6

根据这个Paweł Kozłowski 的回答,AngularUI-Bootstrap 的 Typeahead 在使用最新 Angular 版本(我使用的是 1.2.X)异步获取带有 $resource 的弹出项目时应该可以工作。

Plunk - Paweł 的版本 - Typeahead with $http

我想我不知道如何正确使用它(结果我在typeaheadHighlight指令的代码中收到错误 - typeahead 将立即返回Resource的 s 视为字符串和轮胎以突出显示它们)。

Plunk - 使用 $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 中的这些更改兼容?

4

5 回答 5

7

应该:

$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 上对我有用

于 2014-02-19T17:38:05.633 回答
4

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

$scope.cities = function(prefix) {
    return dataProviderService.query({q: prefix}).$promise.then(
      function(response){
        return response;
    });
};
于 2014-02-26T17:24:33.883 回答
1

I ran into this same problem and it had me banging my head against the wall. The problem is with the data service since it is returning an array of strings instead of wrapping them in a JSON object. $resource will not work with an array of strings.

For additional info, check out this answer: One dimensional array of strings being parsed to 2d by angular resource

于 2014-03-03T20:51:56.690 回答
1

typeahead="i.t_UserName for i in employeeInfo | filter:$viewValue | limitTo:4"
作为 html 输入的属性

并在您的控制器中(使用员工资源)

$scope.employeeInfo = getEmployeeResourceSvc.getEmplInfo.query(function(response){ $scope.employeeInfo= response; });

于 2014-03-10T15:46:04.677 回答
1

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

$scope.cities = function (q) {
    return $scope.resource.query({ q: prefix }).$promise
}
于 2015-05-28T00:34:26.833 回答