通过Typeahead.js提供建议

Question

我有一个应用程序，它使用Bootstrap，jQuery，Typeahead.js和Azure搜索。我正在尝试使用建议功能。为了做到这一点，我有以下几点：

var engine = new Bloodhound({
  datumTokenizer: Bloodhound.tokenizers.whitespace,
  queryTokenizer: Bloodhound.tokenizers.whitespace,
  remote: {
    url: 'https://my-app.search.windows.net/indexes/my-index/docs/suggest?api-version=2015-02-28',
    prepare: function (settings) {
      settings.type = 'POST';
      settings.contentType = 'application/json; charset=UTF-8';
      settings.data = { search: query, suggesterName: 'mySuggestions', top: 10 };                                                        
      return settings;
    }
  }
});

$('#searchField').typeahead([{
  minLength: 5,
  name: 'suggestions',
  source: engine
}]);

当我在searchField中输入文本时，我从未见过向Fiddler中的Azure搜索服务发出的请求。同时，我在控制台窗口中没有看到任何错误。我做错了什么？

Answer 1

在我看来有几件事是不对的。首先，这是：

$('#searchField').typeahead([{
  minLength: 5,
  name: 'suggestions',
  source: engine
}]);

可能需要更像这样：

$('.typeahead').typeahead(null,{
  minLength: 5,
  source: engine
});

此外，引擎函数中的准备需要包括“查询”arg。

var engine = new Bloodhound({
  datumTokenizer: Bloodhound.tokenizers.whitespace,
  queryTokenizer: Bloodhound.tokenizers.whitespace,
  remote: {
    url: 'https://my-app.search.windows.net/indexes/my-index/docs/suggest?api-version=2015-02-28',
    prepare: function (query,settings) {
      settings.type = 'POST';
      settings.contentType = 'application/json; charset=UTF-8';
      settings.data = { search: query, suggesterName: 'mySuggestions', top: 10 };                                                        
      return settings;
    }
  }
});

你可以看到一个正在工作的小提琴这里。