Wie Bilder mit typeahead.js angezeigt werden?

Question

Wie Bilder mit typeahead.js angezeigt werden?

Ich versuche, Bilder für Profile in der Liste anzuzeigen, die von typehead.js erstellt wird.

In diesem Moment habe ich nur Texte zurückkehren können, wie Sie es sehen:

Hier ist, was wie mein Javascript aussieht:

Und meine PHP-Code, wo ich die Profilliste erstellen:

Der JSON $ json_array_test sieht so aus:

Irgendeine Idee, wie man das erreicht?

Answer 1

Sie können Vorlage für Vorschlag erstellen:

$('#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>') 
    } 
}); 

Nur korrekte json von Ihrem Backend zurück:

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