使用 typeahead 和 JSON 仅适用于第一个字母

Question

搜索 Typeahead 和 Bloodhound 文档我没有找到有用的东西 os 我做错了什么，因为我只在输入第一个字母时得到建议，但我继续输入单词和它找不到匹配项。我找到了一种读取 JSON 并在 this question 上过滤它的方法，但没有别的。似乎单词识别没有按预期工作。请对这段代码有经验的人可以启发我我所缺少的东西。

JAVASCRIPT

var globalCats = new Bloodhound({
    datumTokenizer: Bloodhound.tokenizers.whitespace,
    queryTokenizer: Bloodhound.tokenizers.whitespace,
    limit: 10,
    prefetch: {
        url: 'js/data.json',
        filter: function (list) {
            return $.map(list, function (item) {
            return {
                nombre: item.nombre,
                id: item.id,
                padre: item.padre
            };
        });
     }
    }
});

globalCats.initialize();
    $('.typeahead').typeahead({
         highlight: true
    },
    {
         name: 'recomendaciones',
         displayKey: 'nombre',
         source: globalCats.ttAdapter(),
         templates: {
             empty: [
                 '<div class="card red white-text"><strong>No hay sugerencias para su búsqueda</strong></div>'
             ].join('\n'),
             suggestion: Handlebars.compile('<div class="card"><a href="busqueda.php?catid={{id}}"><strong>{{nombre}}</strong> - Departamento {{padre}}</a></div>')
             }
    });

HTML

<form class="col s12 z-depth-1">
     <div class="row">
          <div class="col s12">
               <p>Ingrese sus términos de búsqueda o de click en Solicitar Servicio para publicar su requerimiento en sus redes sociales.</p>
          </div>
          <div class="input-field col s12 m9">
               <input id="buscador" type="text" placeholder="VEAMOS" class="typeahead">
          </div>
    </div>
</form>

JSON

[
    {
        "nombre": "Operadores de Taladradoras",
        "id": 111454,
        "padre": "Construcción"
    },
    {
        "nombre": "Operadores de Maquinaria",
        "id": 454654,
        "padre": "Construcción"
    },
    {
        "nombre": "Estilistas",
        "id": 454678,
        "padre": "Belleza"
    }
]

Answer 1

datumTokenizer错了

我不太了解这部分，但我发现在我尝试过的所有变体中似乎都有效。分词器需要引用您要返回的对象。因此，将分词器从默认值更改为：

Bloodhound.tokenizers.obj.whitespace('nombre'),

此外，除非您确定返回的数据量非常小，否则我建议更改为 remote 而不是 prefetch。

Here is a link 一个工作示例。

使用 typeahead 和 JSON 仅适用于第一个字母

Using typeahead and JSON only works first letter

jquery

typeahead.js

materialize

bloodhound