使用 Node 和 Handlebars 动态填充下拉列表

Posted 2023-03-08

【中文标题】使用 Node 和 Handlebars 动态填充下拉列表

【英文标题】：Issue Dynamically Populating Dropdown Using Node and Handlebars

【发布时间】：2018-10-09 10:48:38

【问题描述】：

我正在尝试动态填充模板上的下拉列表。我正在将公司 ID 添加到数组中，然后尝试将数组传递给模板。

将 ID 添加到数组中：

var express = require('express');
//var mysql = require('./dbcon.js');


var mysql = require('mysql');
var pool = mysql.createPool(
  connectionLimit : 10,
  host  : 'localhost',
  user  : 'root',
  password: 'Baseball247!',
  database: 'award'
);


var app = express();
var handlebars = require('express-handlebars').create(defaultLayout:'main');

app.engine('handlebars', handlebars.engine);
app.set('view engine', 'handlebars');
app.set('port', 3000);
app.use(express.static('public'));
app.get('/add-user', function(req,res)
  var context = ;
  pool.query("SELECT id from company;", function(err,rows,fields)
    if (err)
      console.log(err);
      next(err);
      return;
    
    context.results = rows;
    var companies = [];
    //console.log('The solution is: ', rows.length);
    for (var i =0; i < rows.length; i++) 
      //console.log('The solution is: ', rows[i]["id"]);
      companies.push(rows[i]["id"]);
    
    console.log(companies);
    res.render('addUser', companies : companies);
  );
);

然后，我尝试通过以下方式在下拉列表中显示这些值：

<select>
    <% for(var i=0; i < companies.length; i++)  %>
        <option><%= companies[i] %></option>
    <%  %>
</select>

但是，当我查看网页时，下拉菜单显示的是这个而不是公司 ID：

当我console.log 数组时，我看到了正确的结果，所以我认为问题在于我如何传递数组或我如何遍历/调用模板中的数组。有人知道我在这里缺少什么吗？

【问题讨论】：

实际使用handlebars库填充模板的代码在哪里？是在服务器上还是客户端上，你能显示一下代码吗？

@JasonLivesay 也许我很困惑。我认为使用把手填充模板的代码是在服务器上运行的第一个代码块。第一个代码块来自我的服务器端代码。

我没有看到任何引用车把的代码，那在哪里

@JasonLivesay 我将它添加到上面的服务器端代码中。如果这不是您所引用的内容，请致歉。

【参考方案1】：

select 的语法应该是：

    <p>Company: <select name="company" id="company">
    #each companies
        <option>this</option>
    /each
    </select>

【参考方案2】：

Handlebars 使用不大于百分比的花括号。你能检查一下基本文档吗？谢谢。