javascript - typeahead.js 提示和突出显示参数不适用于预取和远程

Question

我按照此处的说明使用 bloodhound 实现 typeahead: http://twitter.github.io/typeahead.js/examples/#bloodhound

这是我的 html:

<div id="remote">
  <input class="typeahead" type="text" placeholder="Search for cast and directors"> 
</div>

这是我的js:

$(document).ready(function() {
var castDirectors = new Bloodhound({
  datumTokenizer: Bloodhound.tokenizers.obj.whitespace('value'),
  queryTokenizer: Bloodhound.tokenizers.whitespace,
  prefetch: '../api/v1/search/people_typeahead',
  remote: '../api/v1/search/people_typeahead?q=%QUERY',
    dupDetector: function(remoteMatch, localMatch) {
        return remoteMatch.value === localMatch.value;
    }
});

castDirectors.initialize();

$('#remote .typeahead').typeahead(null, {
  name: 'cast-directors',
  displayKey: 'value',
  source: castDirectors.ttAdapter(),
    hint: false,
    highlight: true,
    templates: {
        empty: [
      '<div class="empty-message">',
      'No matching names',
      '</div>'
    ].join('\n'),
        suggestion: Handlebars.compile('<a id="typeahead" href="{{link}}"><p>{{value}}</p></a>')
    }       
});
});

但是，即使将提示设置为 false 并将突出显示设置为 true，我仍然会看到提示，并且不会在预输入中获得突出显示。我应该改变什么？

Answer 1

尝试放置提示，突出显示并添加 minLength: 1 而不是第一个 null，它应该如下所示:

$('#remote .typeahead').typeahead(
{
    hint: false,
    highlight: true,
    minLength: 1
},
{
  name: 'cast-directors',
  displayKey: 'value',
  source: castDirectors.ttAdapter(),

    templates: {
        empty: [
      '<div class="empty-message">',
      'No matching names',
      '</div>'
    ].join('\n'),
        suggestion: Handlebars.compile('<a id="typeahead" href="{{link}}"><p>{{value}}</p></a>')
    }       
});