Question

我的twte typeahead的初始是：

 var cityList = new Bloodhound({
            datumTokenizer: Bloodhound.tokenizers.obj.whitespace('value'),
            queryTokenizer: Bloodhound.tokenizers.whitespace,
            remote: {
                url: $('#citySearchInput').attr('data-src')+'?query=%QUERY',
                wildcard: '%QUERY',
                dataType: "json",                    
                ajax : {                       
                    type: "GET"
                }
            }
        });
     $('#citySearchInput').typeahead({
                minLength: 2,
                highlight: true,
                hint: true
            }, {
            display: 'value',
            source: cityList,
            limit:25,
            valueKey: 'query',
            templates: {
                empty: function(data){
                    console.log(data);
                    return 'empty';
                },
                suggestion:  function(data) {
                    console.log(data);
                    return '<p><a href="'+data.link +'">' + data.value + '</a></p>';
                }
            }
        });

它的工作是从后端回答：

[{"link":"\/en\/forecast\/Iran\/Ostan-e-Lorestan\/Defkandar","value":"Defk\u0101ndar, Ost\u0101n-e Lorest\u0101n(Iran)"},{"link":"\/en\/forecast\/Iran\/Ostan-e-Lorestan\/Defkundar","value":"Defk\u016bndar, Ost\u0101n-e Lorest\u0101n(Iran)"}]

但是当返回更多数据时，例如8项 - 总是写＆＃34;空＆＃34;并在建议数据0。我在js的限制设置为25到100之后修复它，但我不认为这是正确的方法。

Answer 1

对于我的用例，后端仅限于返回25个项目。我将打字设置为limit:25，因为这看起来非常明智。当我在JSON中返回的结果少于25时，我注意到我显示了结果，但是当JSON有25个项目时没有任何反应。

我在阅读你的问题后添加了一个空模板，并且每次有25个结果时都会触发它。可能是代码中的一个错误？我还没有调查过它。

我将Typeahead的限制提高到50，因为知道后端确保我永远不会看到超过25个。现在一切正常。

这主要是我的帖子，它试图强调您的解决方法在后端确保限制的情况下有效。

Twitter Typeahead与远程json无法正常工作

1 个答案: