Как использовать движок предложений Bloodhound? (Объекты нескольких собственности передается локально)

Question

Так я прошел объект, который выглядит следующим образом:

[{id: 1, name: 'Project A', type: 'C'}, {id: 2, name: 'Project B', type: 'A'},] 

И я пытаюсь передать его через Bloodhound Engine так:

var mySource = new Bloodhound({ 
    identify: function (obj) { return obj.id; }, 
    queryTokenizer: Bloodhound.tokenizers.whitespace, 
    datumTokenizer: Bloodhound.tokenizers.obj.whitespace('name'), 
    local: datasource 
}); 

Для следует использовать typeahead.js следующим образом:

$(control) 
    .typeahead({ 
      hint: true, 
      highlight: true, 
      minLength: 0 
     }, 
     { 
      source: mySource 
     }); 

Но он просто никогда не работает. Я не уверен, что я делаю неправильно.

Я просто хочу, чтобы имя было доступно для поиска. Идентификатор и тип передаются по адресу .on('typeahead:autocomplete') в более позднее время.

---

EDIT: Там нет ошибок в консоли, и положить console.log(mySource); сразу после создания объекта ищейка производит Bloodhound объект:

Answer 1

Сначала в ваших JS установленных Ищейки:

var dataSetBloodhound = new Bloodhound({ 
    datumTokenizer: Bloodhound.tokenizers.obj.whitespace('name'), 
    queryTokenizer: Bloodhound.tokenizers.whitespace, 
    local: data 
}); 

Где data находится список предложений в n.
Mine, например, является

data = [ { name: "Foo", url: "/bar.jpg" }, etc, etc ] 

поэтому я использую имя в Bloodhound.tokenizers.obj.whitespace('name'), потому что я хочу, чтобы мои предложения, чтобы быть в массиве данных name.

В моей HTML У меня есть вход:

<input id="quick-search-input" type="text" class="form-control" placeholder="Products" data-provide="typeahead"/> 
//The important thing here is 'data-provide="typeahead"' 

которая является входным, что коробка предложение будет действовать на.

Затем настройке JS за ним:

$('#quick-search-input').typeahead({ 
    hint: true, 
    highlight: true, 
    minLength: 1 
}, 
{ 
    name : 'NameForFormInput', 
    displayKey: 'name', 
    templates: 
    { 
     suggestion: function(data) 
     { 
      return '<li class="list-group-item"> 
        <p class="predictionText">'+data.name+'</p></li>'; 
     } 
    }, 
    source : dataSetBloodhound 
}); 

Я думаю, что это, где вы собираетесь не так, как у меня была аналогичная проблема при установке его, но фиксировано, когда я реализовал шаблон. Также css будет отличаться в зависимости от того, что вы используете.