如何在 node.js 搜索栏中添加自动完成功能？

【问题标题】：How to add autocomplete feature in node.js search bar?如何在 node.js 搜索栏中添加自动完成功能？
【发布时间】：2019-07-02 01:29:08
【问题描述】：

我使用 Node 作为服务器端语言和一个 mongodb 数据库。我想知道如何在搜索栏中添加自动完成功能。例如，我的对象中有一个属性“materialCode”，当我输入“12”时，我想要一个下拉框，显示该特定集合中所有以 12 开头的 materialCode。任何帮助将不胜感激

【问题讨论】：

能否请您指定哪个前端或模板引擎？
我正在使用ejs模板引擎
我现在用的是ejs模板引擎，你能检查一下吗？如果您遇到任何错误，您会遇到什么错误？
谢谢！成功了！

标签： node.js mongodb mongoose

【解决方案1】：

通常我们会在前端这样做。如果您使用的是 html5，则可以轻松完成。（假设您使用任何模板引擎或角度或反应。）使用任何服务调用从后端（节点）获取所有数据（假设您将数据存储在 allMaterialCode）。然后遍历该 allMaterialCode 并将 materialCode 值发送到 html5 dataList，如下所示。（通过循环 allMaterialsCode 来绑定 materialCode）。（假设你正在运行 node ejs 服务器）

<input list="browsers">

<datalist id="browsers">
        <% 
            var dataObj = ["12","1223","12456","12345","13322","9877"];
        %>
        <%
            for ( let singleItem of dataObj ) {
        %>
            <option value='<%= singleItem %>'>
        <%
            }
        %>
</datalist>

这些链接可能会有所帮助。

AutoCompleteHTMl SO

w3schools autocomplete

【讨论】：