angularjs typeahead 和异步 api 调用问题

Question

我有以下实现，html：

<input id="myField" name="myField" class="form-control" type="text" placeholder="myField"
ng-model="myController.myObj.FieldValue" typeahead-editable="false" 
uib-typeahead="item as item.Description for item in myController.fieldDS($viewValue)" required>

控制器：

var vm = this;
vm.fieldDS = myService.getFieldDS;

服务：

function getFieldDS() {
return [{'Description': 'ItemA'}, {'Description': 'ItemB'}, {'Description': 'ItemC'}];
}

而且效果很好。当我尝试调用远程异步 api 时，问题就出现了。我使用 ngResource 更改了服务，并尝试使用以下功能：

function getFieldDS() {
  return Resource.query();
}

function getFieldDS() {
  var items = Resource.query();
  return items.$promise;
}

function getFieldDS() {
  var items = Resource.query();
  items.$promise.then(
     function (result, responseHeaders) {
       return result;
     },
     function (httpResponse) { console.log('failed: ' + httpResponse); }
  );
}

或控制器上的代码：

vm.fieldDS = myService.getFieldDS;

vm.fieldDS = function () {return myService.getFieldDS();};

myService.getFieldDS().then(function (result) { vm.fieldDS = result;})

在最后一种情况下，我收到有关预期功能的类型错误，可能是未找到绑定源！？

在所有其他情况下，当我在输入字段中插入字符时，页面加载时，已调用 api，但输入列表中未显示任何内容。如果我尝试使用 console.log 来自查询或来自服务的响应，则数组已正确获取。似乎控制器或预输入字段不等待 api 的响应，但我不明白如何解决这个问题。请你帮帮我好吗？非常感谢

编辑：服务方式：

function getFieldDS() {
  var items = Resource.query();
  return items.$promise;
}

和控制器：

function getSomething() {
 var temp = myService.getFieldDS();
 temp.then(
   function(result) {
     console.log(result);
     return result;
   }
 );
 return temp;
}
vm.fieldDS = getSomething;

在控制台上打印包含所有对象的正确数组，但它们不会添加到预输入字段中。我找到了一些具有相同实现的示例代码，但我不明白为什么在我的情况下它不起作用。

Answer 1

问题已解决！该问题与与 block-ui 模块的冲突有关。配置它 blockUiConfig 与 autoblock = false;

angularjs typeahead 和异步 api 调用问题

Issue with angularjs typeahead and async api call

asynchronous

typeahead

angularjs

asp.net-web-api2

angularjs-ng-resource