输入菜单中的分隔符？

Question

我不确定我们是否已经有了使用单一数据源在预输入菜单中显示分隔符的方法。我尝试了多种组合，尝试四处寻找解决方案，但一无所获。

更像是下面的屏幕截图，我从单一来源获得此数据：

['US: channel1', 'US: channel2', 'US: channel3', 'US: channel4', 'US: channel5', 'CA: channel1', 'CA: channel2']

在上面的数据中，我想在美国频道之后显示一个分隔符，然后显示 CA 频道选项。

如果需要显示分隔符，我可以将数据源更新为多维数组或任何其他自定义项。或者，typeaheadjs 范围之外的任何其他方式。

请帮我找到一个可行的解决方案。

Answer 1

我想，我要回答我的问题了。这是怎么做到的。

我插入了一个空白值，该值将被替换为分隔符。

['US: channel1', 'US: channel2', 'US: channel3', 'US: channel4', 'US: channel5', '', 'CA: channel1', 'CA: channel2']

要插入空白数据，我们可能必须使用来自单一数据源的多维数组。

并且，使用 typeaheadjs 的 typeahead:render 事件，我必须如下所示进行处理：

 $(input).bind('typeahead:render', function (e) {
     var currentInput = $(e.target),
         options;

    options = $(currentInput).closest('.column-filter').find('.tt-suggestion');
    $(options).each(function (index, element) {
        if (!$(element).text().trim().length) {
            $(element).replaceWith('<hr>');
        }
    });
});

jsfiddle link 有一个工作示例。

输入菜单中的分隔符？

Separator in typeahead menu?

typeahead.js