[英]Multiple Remote Sources with Twitter Typeahead.js
我正在使用 Twitter typeahead.js 库通过单个数据源/api/domains
进行提前搜索。
我现在想使用其他 API 端点添加另外两个源:
/api/ips
/api/hostnames
我将如何做到这一点? 我是否需要使用 BloodHound 引擎来实现此功能?
现有代码
<script>
$('#header').on('click', '.tt-selectable', function() {
window.location.href = "/explore/" + $(this).attr('data-domain');
});
var substringMatcher = function(strs) {
return function findMatches(q, cb) {
var matches, substringRegex;
// an array that will be populated with substring matches
matches = [];
// regex used to determine if a string contains the substring `q`
substrRegex = new RegExp(q, 'i');
// iterate through the pool of strings and for any string that
// contains the substring `q`, add it to the `matches` array
$.each(strs, function(i, str) {
if (substrRegex.test(str)) {
matches.push(str);
}
});
cb(matches);
};
};
$.getJSON('/api/domains')
.done(function( json ) {
populateSuggestions(json.domains);
})
.fail(function( jqxhr, textStatus, error ) {
var err = textStatus + ", " + error;
console.log( "Request Failed: " + err );
});
const populateSuggestions = function(data) {
$('.typeahead').typeahead({
hint: true,
highlight: true,
minLength: 1
}, {
displayKey: 'name',
limit: 10,
source: substringMatcher(data),
templates: {
suggestion: function (data) {
return "<div data-domain=" + data + ">" + data + "</div>"
}
}
});
}
</script>
现有 API 响应
{
domains: [
"a.com",
"b.com",
"c.com",
"d.com" ]
}
您想要按来源区分的建议吗? 我希望如此,因为一个来源是域,一个是 IP 地址(我认为?),另一个是主机名。 前两个我希望有人输入非常不同的条目并返回非常不同的数据。
无论如何,这就是我经常使用 typeahead 的方式 - 类似的搜索但有多个来源 - 是的,我使用 Bloodhound 来设置每个来源。 然后对于每个猎犬源,我在预先输入设置中有一个单独的 JSON 对象。 像这样:
$('#searchbox .typeahead').typeahead({ hint: true, highlight: true, autoselect: true, minLength: 2 }, { name: 'other', display: 'addr', source: otherBH, templates: { header: "<span class='typeahead-header'>Static</span>" } }, { name: 'lookupSvc', display: 'lookupSvc', source: lookupServiceBH, templates: { header: "<span class='typeahead-header'>AJAX</span>" } } ...
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.