Typeahead.js – 在多个属性值中搜索

请参阅下面的示例。

JSFiddle： http ： //jsfiddle.net/R7UvH/2/

如何让typeahead.js （0.10.1）在多个属性值中搜索匹配项？ 理想情况下，在整个data （ data.title ， data.desc和所有data.category[i].name ）

  datumTokenizer: function(data) { // **search in other property values; eg data.title & data.desc etc..** return Bloodhound.tokenizers.whitespace(data.title); }, 

整个例子：

 var data = [{ title: "some title here", desc: "some option here", category: [{ name: "category 1", }, { name: "categoy 2", }] }, { title: "some title here", desc: "some option here", category: [{ name: "category 1", }, { name: "categoy 2", }] }]; var posts = new Bloodhound({ datumTokenizer: function(data) { // **search in other property values; eg data.title & data.desc etc..** return Bloodhound.tokenizers.whitespace(data.title); }, queryTokenizer: Bloodhound.tokenizers.whitespace, local: data }); posts.initialize(); $('#search-input').typeahead({ highlight: true }, { name: 'Pages', displayKey: 'title', source: posts.ttAdapter(), templates: { header: '
Pages
' } }); 

Answer 1

Typeahead 0.10.3添加了“对多个属性标记化的对象标记化器的支持”。

所以，你的榜样就变成了

 var posts = new Bloodhound({ datumTokenizer: Bloodhound.tokenizers.obj.whitespace('title', 'desc'), queryTokenizer: Bloodhound.tokenizers.whitespace, local: data }); 

但是，我认为这不适用于嵌套在其中的属性，即您的案例中的data.category对象。

另请注意，如果您使用的是预取数据，请务必先清除本地存储，否则新的tokenizer将不会生效（因为在添加到搜索索引时使用了datumTokenizer ，并且如果localStorage已存在数据，那么搜索索引将不会更新）。 我被困在这一段时间了！

Answer 2

return Bloodhound.tokenizers.whitespace(data.title)返回一个字符串数组。

所以，而不是返回该值：保存它（以及您的其他所需值），然后连接它们并返回该值…

 x = Bloodhound.tokenizers.whitespace(data.title); y = Bloodhound.tokenizers.whitespace(data.desc); z = Bloodhound.tokenizers.whitespace(data.category[i].name); return x.concat(y).concat(z); 

Answer 3

我在这里实现了一个解决方案：

http://jsfiddle.net/Fresh/4nnnG/

由于您有本地数据源，因此需要创建单独的数据集以使您能够匹配多个数据属性。 例如

 $('#search-input').typeahead({ highlight: true }, { name: 'titles', displayKey: 'title', source: titles.ttAdapter() }, { name: 'descs', displayKey: 'desc', source: descs.ttAdapter() }, { name: 'cats', displayKey: 'name', source: cats.ttAdapter() });