Angular UI Bootstrap Typeahead - 不显示异步结果

Question

我无法让我的异步响应显示在预输入下拉列表中。我之前认为这是由于响应缓慢，但看起来这不是问题所在。正如文档中所述，我正在 return 做出承诺，我可以看到 return 编辑了正确的数据集，但数据并未显示。如果我 return 一些硬编码数据它可以工作，只是没有承诺。

控制器

  function searchAuditLog(searchValue) {
    var params = angular.copy(vm.params);
    params.campaign_name = searchValue;
    var qsParams = $httpParamSerializer(params);
    // return [ // This works
    //   'DRAFT 1',
    //   'DRAFT 2',
    //   'DRAFT 3'
    // ];
    myapi.searchAuditLog(qsParams)
    .then(function(results){
      return results; // This doesn't
    });
  }

工厂

  function searchAuditLog(qs) {
    return $http.get(myapi + '/1.0/audit?' + qs)
    .then(function(response) {
      return response.data.results.map(function(item){
        return item.metadata.campaign_name;
      });
    })
    .catch(getFailed)
  }

模板

<input type="text" ng-model="vm.selectedEvents" placeholder="{{ 'idm.search' | translate }}" class="form-control" uib-typeahead="query for query in vm.searchAuditLog($viewValue)" class="form-control" typeahead-show-hint="true" typeahead-min-length="3" typeahead-on-select="vm.changeSearch($item, $model, $label, $event)" typeahead-no-results="vm.noSearchResults">
<i ng-show="loadingLocations" class="glyphicon glyphicon-refresh"></i>
<div ng-show="noResults">
  <i class="glyphicon glyphicon-remove"></i> No Results Found
</div>

Answer 1

异步 typeahead 需要 promise 对象才能在选项中显示异步 data。您来自控制器的 searchAuditLog 函数还应该 return 一个承诺，以便数据将填充到 typeahead.

中

控制器

function searchAuditLog(searchValue) {
    var params = angular.copy(vm.params);
    params.campaign_name = searchValue;
    var qsParams = $httpParamSerializer(params);
    //return promise from here
    return myapi.searchAuditLog(qsParams)
     .then(function(results){
        return results;
     });
}

Angular UI Bootstrap Typeahead - 不显示异步结果

Angular UI Bootstrap Typeahead - No Async Results Displayed

asynchronous

promise

typeahead

angularjs

angular-ui-bootstrap