jquery – Typeahead和Bloodhound – 如何获取JSON结果

我有国家列表： http://vocab.nic.in/rest.php/country/json

而我正在尝试通过Bloodhound建议引擎获取country_id和country name. O尝试以下代码：

var countries = new Bloodhound({
    datumTokenizer: Bloodhound.tokenizers.obj.whitespace('country_name'),queryTokenizer: Bloodhound.tokenizers.whitespace,limit: 10,prefetch: {
        url: 'http://vocab.nic.in/rest.PHP/country/json',filter: function(response) {
            return response.countries;
        }
    }
});

$('#my-input').typeahead({
        hint: true,highlight: true,minLength: 1
    },{
        name: 'states',displayKey: 'value',source: countries.ttAdapter()
    });

哪个不行.我应该如何更改代码以使其工作？

解决方法

// instantiate the bloodhound suggestion engine
var countries = new Bloodhound({  
  datumTokenizer: function(countries) {
      return Bloodhound.tokenizers.whitespace(countries.value);
  },remote: {
    url: "http://vocab.nic.in/rest.PHP/country/json",filter: function(response) {      
      return response.countries;
    }
  }
});

// initialize the bloodhound suggestion engine
countries.initialize();

// instantiate the typeahead UI
$('.typeahead').typeahead(
  { hint: true,minLength: 1
  },{
  name: 'countries',displayKey: function(countries) {
    return countries.country.country_name;        
  },source: countries.ttAdapter()
});

Example Codepen

前置输出

笔记：

>您的服务器上的数据=“prefetch”.> data from outside =“remote”