在以前的版本中,我可以这样做:
$('#search').typeahead({ name: 'Search', remote: '/search?query=%QUERY' });
但是自从0.10更新以来,typeahead.js要求我们定义source我无法使之工作的内容。如何定义远程而不需要定义数据集功能?
0.10
source
Typeahead.js版本0.10.0现在使用称为建议引擎的单独组件来提供建议数据。Typeahead.js附带的建议引擎称为Bloodhound。
因此,您不能“无需定义数据集函数即可定义远程”。
可以在以下位置找到使用远程数据源的示例(我正在查询TheMovieDb API,例如尝试搜索“ Aliens”):
代码在这里:
// Instantiate the Bloodhound suggestion engine var movies = new Bloodhound({ datumTokenizer: function (datum) { return Bloodhound.tokenizers.whitespace(datum.value); }, queryTokenizer: Bloodhound.tokenizers.whitespace, remote: { url: 'http://api.themoviedb.org/3/search/movie?query=%QUERY&api_key=470fd2ec8853e25d2f8d86f685d2270e', filter: function (movies) { // Map the remote source JSON array to a JavaScript object array return $.map(movies.results, function (movie) { return { value: movie.original_title }; }); } } }); // Initialize the Bloodhound suggestion engine movies.initialize(); // Instantiate the Typeahead UI $('.typeahead').typeahead(null, { // Use 'value' as the displayKey because the filter function // returns suggestions in a javascript object with a variable called 'value' displayKey: 'value', source: movies.ttAdapter() });
请注意,过滤器功能如何使您可以从非平凡的JSON数据源中选择要用作预输入建议的内容。
对于那些使用较新版本的typeahead的用户,可以在此处找到基于原始问题的工作示例:
关于Typeahead 0.10.0,新版本(0.11.1)具有以下区别: