javascript - 当还剩下一个远程结果时，Typeahead Remote 返回两个未定义

Question

我正在构建从远程 json API 搜索信息的功能。我无法预取任何数据，因为数据集非常大(3000+)，并且为了获得预取结果，我需要提供单个字母查询。

我遇到的问题是，当我在搜索中只剩下一个结果时，Typehead 停止给我结果，只显示两个未定义的项目作为结果。

这就是它的样子:

此时我已经通过控制台尝试了所有我能想到的方法来尝试调试它，但无法找到任何地方来查看这些数据的来源。

这是 Bloodhound 和 typeahead 初始化的代码。

var items = new Bloodhound({
    datumTokenizer: function (datum) {
        return Bloodhound.tokenizers.whitespace(datum.k);
    },
    queryTokenizer: Bloodhound.tokenizers.whitespace,
    remote: {
        url: App.target + "crm/sf/list/item/%QUERY/5",
        filter: function (parsedResponse) {
            return parsedResponse.Listing.list.entries;
        },
    }
});

items.initialize();

$('#itemNoSrch').typeahead(null, {
    autoselect: true,
    displayKey: 'k',
    source: items.ttAdapter()
}).on('typeahead:selected', function (obj, datum, name) {
    App.searchData.itemNo = datum.k.replace("/", "*");

    $('#itemSrchPlaceholder').val(datum.k);
    App.itemInvalid = false;
});

编辑:

以下是 crm/sf/list/item/%QUERY/5 的 JSON 响应，其中查询为 a。

{
"Listing": {
        "list": {
            "entries": [
                {
                    "k": "A-10-10",
                    "v": 1320
                },
                {
                    "k": "A-10-7",
                    "v": 4841
                },
                {
                    "k": "A-10-8",
                    "v": 4821
                },
                {
                    "k": "A14YV4835",
                        "v": 1327
                },
                {
                    "k": "A0554835",
                    "v": 1325
                }
            ]
        }
    }
}

下面是我如何只能假设发生这种情况时会出现输出，我在 Google Chrome 的最新稳定版本上使用了控制台。

我会提供一个基于 API 的 fiddle ，但服务器目前不添加跨域 header 。

请告知我所需的任何其他信息。

Answer 1

我发现问题了!当我的远程数据集是一个结果时，它作为对象而不是数组返回。

输出如下所示。

{
"Listing": {
    "list": {
        "entries": {
            "k": "A-10-10",
            "v": 1320
        }
    }
}

所以我在过滤器中添加了以下内容

filter: function (parsedResponse) {
        if(parsedResponse.Listing.list.entries instanceof Array){
            return parsedResponse.Listing.list.entries;
        }else{
            return [parsedResponse.Listing.list.entries];
        }
    },