Bloodhound匹配不适用于特殊角色



我在Bloodhound中使用typeahead.js来搜索使用本地源的用户:

let users = [
{name: 'John Doe (john.doe@email.org)', value: '3421'},
{name: 'Jane Doe (test@email.org)', value: '8100'},
];

匹配显示键为name:

$('input').typeahead(
{
minLength: 1,
highlight: true
},
{
name: 'users',
displayKey: 'name',
source: new Bloodhound({
datumTokenizer: Bloodhound.tokenizers.obj.whitespace('name'),
queryTokenizer: Bloodhound.tokenizers.whitespace,
local: users
})
}
);

当按用户名搜索时,它确实匹配,例如"John"或"Jane"。但如果你通过电子邮件搜索,例如"john.doe"、"test"或"email.org",则不会。

但是,如果去掉括号,例如'John Doe john.doe@email.org',则"john.doe"确实匹配。但不是"email.org"。

其他特殊字符,如<,例如'John Doe <john.doe@email.org>',也有同样的问题。

为什么特殊字符会破坏数据匹配,我能做些什么来帮助它?

这是一支工作笔。

我可以有一个额外的属性:

let users = [
{name: 'John Doe (john.doe@email.org)', value: '3421', match: 'John Doe john.doe@email.org'},
{name: 'Jane Doe (test@email.org)', value: '8100', match: 'Jane Doe test@email.org'},
];

通过新密钥匹配:

datumTokenizer: Bloodhound.tokenizers.obj.whitespace('match')

或者我可以有一个新的属性email,并有以下数据标记器:

datumTokenizer: u => Bloodhound.tokenizers.whitespace([u.name + ' ' + u.email])

但这远非理想。但是我怎样才能使name密钥匹配呢?

您似乎需要使用自己的标记化器,如下所示。

const customTokenizer = (user) => {
const tokens = user.name.split(/[s()]+/);
console.info('Tokenizer', user, '=>', tokens);
return tokens;
};
let users = [{
name: 'John Doe (john.doe@email.org)',
value: '3421'
// , email: 'john.doe@email.org'
},
{
name: 'Jane Doe (test@email.org)',
value: '8100'
//, email: 'test@email.org'
},
];
$('input').typeahead({
minLength: 1,
highlight: true
}, {
name: 'users',
displayKey: 'name',
source: new Bloodhound({
// datumTokenizer: u => Bloodhound.tokenizers.whitespace([u.name + ' ' + u.email]),
datumTokenizer: customTokenizer,
queryTokenizer: Bloodhound.tokenizers.whitespace,
local: users
})
});
.tt-menu {
background-color: white;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/typeahead.js/0.11.1/typeahead.bundle.min.js"></script>
<div id="search">
<input type="text" placeholder="Search user">
</div>

datumTokenizerqueryTokenizer都使用nonword标记器。

相关内容

  • 没有找到相关文章

最新更新