come utilizzare manubri/baffi e bootstrap typeahead per il rendering dell'articolo

Question

Desidero personalizzare l'elemento che viene reso da typstart di bootstrap utilizzando il modello di manubri. Guardando il codice sembra che l'elemento predefinito sia <li><a href="#"></a></li>.

Supponiamo che mi piacerebbe utilizzare un modello di manubri per il rendering del mio articolo.

A mio parere, dovrei ridefinire la funzione di rendering in questo modo (1).

La mia domanda è:
come utilizzare il (1) con bootstrap-typeahead.js v2.1.0`?

Ecco (2) il codice sulle opzioni che sto passando a $.fn.typeahead e (3) il mio modello di manubri/baffi.

---

(1)

var renderItem = function (ul, user) { 
    // user is the Backbone.Model 
    return $('<li></li>') 
     .data('item.autocomplete', user) 
     .append(autocompleteItemTemplate(user.toJSON())) 
     .appendTo(ul); 
}; 

---

(2)

element.typeahead({ 
    minLength: 3, 
    source: function() { 
     var users = app.userCollection; 

     users = _.map(users, function (user) { 
      return user.get('first_name') + ' ' + user.get('last_name'); 
     }); 
     return users; 
    } 
}); 

---

(3)

<a>{{ first_name }} {{ last_name}}</a> 

Answer 1

È possibile sovrascrivere il metodo di rendering in questo modo:

element.data("typeahead").render = function (items) { 
    var that = this; 

    that.$menu.empty(); 
    items = $(items).map(function (i, item) { 
     i = renderItem(that.$menu, item).attr("data-value", item); 
     i.find("a").html(that.highlighter(item)); 
     return i[0]; 
    }); 

    items.first().addClass("active"); 
    return this; 
}; 

Tuttavia, poiché proprietà source di typeahead deve essere sempre un array di stringhe o di una funzione che restituisce un array di stringhe, nel renderItem funzione l'argomento utente dovrà essere una stringa, quindi penso che non sarai in grado di usare il manubrio.