Как отображать изображения с помощью typeahead.js?

Question

Как показывать изображения с помощью typeahead.js?

Я пытаюсь отобразить изображения для профилей в список, созданный typehead.js.

На данный момент я могу вернуть только тексты, как вы видите здесь:

Вот что мой Javascript выглядит следующим образом:

И мой PHP код, где я построить список профилей:

JSON $ json_array_test выглядит так:

Любая идея, как достичь этого?

Answer 1

Вы можете создать шаблон для внушения:

$('#search-keywords-page').typeahead({ 
    hint: true, 
    highlight: true, 
    minLength: 1 
}, 
{ 
    name: 'profiles', 
    source: profiles, 
    templates: { 
     suggestion: Handlebars.compile('<div><img src="{{image}}" />{{title}} - {{nid}}</div>') 
    } 
}); 

вернуться только правильный JSON от Вашего внутреннего интерфейса:

$array_test[$key] = array(
    'title' => $value->title, 
    'nid' => $value->nid, 
    'image' => $author_image_petite_url 
);