Con bootstrap-3-typeahead Penso che non è possibile utilizzare la proprietà del modello. In questo caso è meglio usare l'evidenziatore . Esempio:
$('#employees').typeahead({
highlighter: function (item) {
var parts = item.split('#'),
html = '<div class="typeahead">';
html += '<div class="pull-left margin-small">';
html += '<div class="text-left"><strong>' + parts[0] + '</strong></div>';
html += '<div class="text-left">' + parts[1] + '</div>';
html += '</div>';
html += '<div class="clearfix"></div>';
html += '</div>';
return html;
},
source: function (query, process) {
var employees = [];
return $.post('employee/search', { query: '%' + query + '%' }, function (data) {
// Loop through and push to the array
$.each(data, function (i, e) {
employees.push(e.name + "#" + e.number);
});
// Process the details
process(employees);
});
}
}
)
Quindi è possibile creare il modello html che viene visualizzato.
Se si desidera mantenere la funzionalità di evidenziazione, utilizzare questa espressione regolare
var name = parts[1].replace(new RegExp('(' + query + ')', 'ig'), function ($1, match) {
return '<strong>' + match + '</strong>'
});
e
html += '<div class="text-left">' + name + '</div>';