使用 Typeahead.js + Bloodhound 远程搜索 JSON 对象数组中的多个值答案

【问题标题】：Search multiple values in array of JSON objects using Typeahead.js + Bloodhound remote使用 Typeahead.js + Bloodhound 远程搜索 JSON 对象数组中的多个值
【发布时间】：2016-08-31 16:57:54
【问题描述】：

我正在尝试使用 Typeahead.js (v0.11.1) + Bloodhound 来显示查询结果。该查询搜索用户列表并根据email、last_name 或first_name 返回匹配项。如果我查询smi，匹配项如下所示：

[{"email":"john@email.com","last_name":"Smith","first_name":"John"},
{"email":"bob@email.com","last_name":"Smith","first_name":"Bob"}]

我的 Bloodhound 引擎如下所示：

var userSearch = new Bloodhound({
    datumTokenizer: function (user) {
        return Bloodhound.tokenizers.obj.whitespace(user.email, user.last_name, user.first_name);
    },
    queryTokenizer: Bloodhound.tokenizers.whitespace,
    remote: {
        url: '/search/users?query=%QUERY',
        wildcard: '%QUERY'
    }
});

问题是 Typeahead 只在有一个 JSON 对象时显示匹配，如果它返回一个对象数组，如上面的示例，则没有匹配。

我尝试将transform 添加到remote，但没有返回任何匹配项：

transform: function(users) {
    return $.map(users, function(user) {
        return {
            email: user.email,
            last_name: user.last_name,
            first_name: user.first_name
        }
    });
}

【问题讨论】：

标签： jquery json typeahead.js bloodhound

【解决方案1】：

问题在于datumTokenizer，您必须像这样连接标记：

datumTokenizer: function (user) {
    var emailTokens = Bloodhound.tokenizers.whitespace(user.email);
    var lastNameTokens = Bloodhound.tokenizers.whitespace(user.last_name);
    var firstNameTokens = Bloodhound.tokenizers.whitespace(user.first_name);
    return emailTokens.concat(lastNameTokens).concat(firstNameTokens);
}

您还需要在remote 上使用transform。但是现在您可以匹配每个 JSON 对象的三个属性中的任何一个。

【讨论】：