我可以让typeahead/bloodhound始终显示用户正在键入的内容吗

Question

我正在使用typeahead/bloodhound实现标签输入。用户可以添加新标签，它们不受现有标签的限制。

我希望始终显示用户在建议列表中键入的内容，这样他们就可以通过单击来创建标记(目前他们可以通过键入逗号或enter来创建标记(。理想情况下，我将能够用"标签"旁边的一个小徽章来区分新标签和现有标签；建议"；说的是新的。

有可能做到这一点吗(如果有，如何做到(？

我现在有的代码，它完全有效(除了不显示下拉列表中键入的内容(：

var tags = new Bloodhound({
datumTokenizer: Bloodhound.tokenizers.obj.whitespace('name'),
queryTokenizer: Bloodhound.tokenizers.whitespace,
prefetch: {
url: '/Tags/list.json',
cache: false,
filter: function(list) {   
return $.map(list, function(tag) {
return { name: tag }; });
}
}
});
tags.initialize();
}
$('.tags-wrapper input').tagsinput({
typeaheadjs: {
name: 'tags',
displayKey: 'name',
valueKey: 'name',
source: tags.ttAdapter(),
}
});

Answer 1

我想通了！

首先我添加了：

templates: {
empty: function(obj) {return '<div class="tt-suggestion tt-selectable tt-current-query">'+obj.query+' <span class="tt-new badge badge-info">New</span></div>';}
}

至$('.tags-wrapper input').tagsinput({ ...

然后我添加了一些新的jquery来检测用户何时点击了一个新的标签

$(document).on("click", ".tt-current-query", function() {
var input=$(this).closest('.twitter-typeahead').find('input.tt-input');
input.trigger("keypress");
});

我不能100%确定为什么这只需要一个按键触发器就可以工作，但它确实可以！我很想知道为什么这样做——我花了一段时间试图注入逗号或回车键事件，最终偶然发现了这个解决方案。