Question

我一直在使用Bloodhound并定义了prefetch [docs]选项。

这很好用，除非我向预取的json文件添加内容，除非我重新启动浏览器，否则它不能用作搜索结果。

所以我试图让搜索结果“实时”反映更新的文件内容。

我尝试将prefetch替换为remote，但这会导致搜索功能无法正常工作（显示不匹配的结果）。

以下是我与prefetch使用的代码。

版本信息typeahead.bundle.min.js位于v0.10.5。

function searchFunction() {
    var template =
        "<p class=\"class_one\">{{area}}</p><p class=\"class_two\">{{title}}</p><p class=\"class_three\">{{description}}</p>";
    var compiled_template = Hogan.compile(template);
    var dataSource = new Bloodhound({
        datumTokenizer: function(d) {
            return Bloodhound.tokenizers.whitespace(d.tokens.join(
                ' '));
        },
        queryTokenizer: Bloodhound.tokenizers.whitespace,
        prefetch: '/static/my_file.json'
        # remote: '/search'
    });
    dataSource.initialize();
    $('.my_lookup .typeahead').typeahead({}, {
        source: dataSource.ttAdapter(),
        name: 'courses',
        displayKey: 'title',
        templates: {
            suggestion: compiled_template.render.bind(
                compiled_template)
        }
    }).focus().on('typeahead:selected', function(event, selection) {
        var title = selection.title
            // do things with the title variable
    });
}

修改

我开始想我可能需要一些服务器端逻辑来对包含先前在本地json文件中的内容的数据库执行搜索。

使用下面发布的代码，以下工作：

实时搜索数据库。
返回所有匹配项。

以下不起作用：

它不提供建议，您必须输入完整的令牌名称。
如果搜索apple，则会在键入a，然后p等后进行搜索，如果没有得到任何结果，则会在Firebug中显示此错误：{{1 }}。在发现其中一些错误后，它会停止触发搜索并且不会显示错误。

而且，数据库的结果采用以下格式，我不知道如何将Hogan模板应用于每个结果的建议：

TypeError: data is null

JS

{
    "matches": [{
        "tokens": ["apple", "orange"],
        "area": "Nautical",
        "_id": {
            "$oid": "4793765242f9d1337be3d538"
        },
        "title": "Boats",
        "description": "Here is a description"
    }, {
        "tokens": ["apple", "pineapple"],
        "area": "Aviation",
        "_id": {
            "$oid": "4793765242f9d1337be3d539"
        },
        "title": "Planes",
        "description": "Here is a description."
    }]
}

MongoDB架构

数据库：function searchFunction() { var engine = new Bloodhound({ remote: { url: '/search?q=%QUERY%', wildcard: '%QUERY%' }, datumTokenizer: Bloodhound.tokenizers.whitespace('q'), queryTokenizer: Bloodhound.tokenizers.whitespace, }); engine.initialize(); $('.my_lookup .typeahead').typeahead({ }, { source: engine.ttAdapter(), name: 'courses', displayKey: 'title', templates: { suggestion: function (data) { return "// not sure how to apply markup to each match" } } }).focus().on('typeahead:selected', function(event, selection) { console.log(selection); var title = "// again not sure how to access individual match data" // do things with the title variable }); }
收集：courses
文件：

courses

和：

{
    "_id" : ObjectId("4793765242f9d1337be3d538"),
    "tokens" : [ 
        "apple", 
        "orange"
    ],
    "area" : "Nautical",
    "title" : "Boats",
    "description" : "Here is a description."
}

等

Python （使用Bottle路线）

{
    "_id" : ObjectId("4793765242f9d1337be3d539"),
    "tokens" : [ 
        "apple", 
        "pineapple"
    ],
    "area" : "Aviation",
    "title" : "Planes",
    "description" : "Here is a description."
}

如何用“实时”替代方法替换Bloodhound中的预取源？

0 个答案: