javascript - 如何在 Angular Material 自动完成中显示来自远程查询的结果？

我正在使用angular-material编写一个网站，在其中使用auto-complete。在此自动完成(codepen here)中，有一个函数可以从演示搜索项的本地数组返回搜索结果，该演示搜索项(简化)如下所示:

function querySearch (query) {
    var results = query ? self.repos.filter( createFilterFor(query) ) : self.repos, deferred;
    return results;
}

现在，我想编辑此代码，以便在键入每个字母后可以查询服务器。因此，我编写了 Angular 代码来查询服务器并返回一个 promise as instructed here:

function querySearch (query) {
    return $http.get('/ajax/user/search/' + query).then(function(data){
        console.log(data); // I've got the data here. All fine.
        return data.data;
    });
}

不幸的是，这并没有真正起作用。服务器查询正常，但是我看到一个空的建议列表，如下所示:

有人知道我该如何解决这个问题？欢迎所有提示!

最佳答案

在此处查看示例，然后单击“模拟查询”并禁用查询缓存-https://material.angularjs.org/latest/#/demo/material.components.autocomplete

如果您确实希望每次触发缓存并设置md-no-cache="false"，请确保禁用缓存md-min-length="0"
您只想替换他们必须用实际查询来模拟查询的超时时间

function querySearch (query) {
  var results = query ? self.states.filter( createFilterFor(query) ) : self.states,
      deferred;
  if (self.simulateQuery) {
    deferred = $q.defer();
    //repalce this
    $timeout(function () { deferred.resolve( results ); }, Math.random() * 1000, false);
    return deferred.promise;
  } else {
    return results;
  }
}

并相应地兑现您的 promise 。

关于javascript - 如何在 Angular Material 自动完成中显示来自远程查询的结果？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/31453927/