如何将变量从 Jade 传递到 .JS 文件？

Question

在我下面的代码中，我在我的 .JS 文件中创建了一个项目数组。然后我能够将这个数组传递给 .Jade 并将数组中的每个值用作下拉列表中的一个项目。我现在想将他们将在下拉列表中单击哪个项目的用户输入传递回服务器端 (.js)，以便我可以使用用户输入来查找更多数据。

我的问题是我不知道如何将 .jade 变量发送到服务器端。我想发送 "this.selectedIndex"/selected "val" 以便我可以将它用作 javascript 文件中的变量。

.JS

router.get('/', function(req, res) {
  var projectPathArray = [];

  async function main() {                       
    var projects = await _db.listProjects();
        projects.forEach(async (item) => {
          var pathy = item.path;
          projectPathArray.push(pathy)
             })


res.render('index', { title: 'Projects', projectPathArray:projectPathArray}); 

}

main();

.玉

extends layout

script(src="libs/jquery-1.11.3.min.js")
link(rel='stylesheet', href='/stylesheets/style.css')

block content
  h1= title

  p To start, please select a project

  html
   body 
    form#test-form(action='', method='get')
    select#menu1(name='menu1', size=projectPathArray.length)
      each val in projectPathArray
        option=val

Answer 1

您将需要使用某种机制从前端与服务器进行通信。这包括但不限于 websockets and/or AJAX.

Answer 2

在不确切了解您想要什么的情况下，这至少应该让您更接近您的要求。

1) 添加处理 post 的路由，您可以在其中使用 req.body.

检索在表单中发回的值

2) 在您的 Pug/Jade 模板中，我缩进了表单元素，使它们位于表单下方，添加了一个提交按钮，并将表单的方法更改为 post.

.JS

router.post('/', function(req, res) {
   console.log(req.body);
   res.redirect('/');
});

router.get('/', function(req, res) {
  var projectPathArray = [];

  async function main() {                       
    var projects = await _db.listProjects();
        projects.forEach(async (item) => {
          var pathy = item.path;
          projectPathArray.push(pathy)
             })


res.render('index', { title: 'Projects', projectPathArray:projectPathArray}); 

});

main();

.玉

extends layout

script(src="libs/jquery-1.11.3.min.js")
link(rel='stylesheet', href='/stylesheets/style.css')

block content
  h1= title

  p To start, please select a project

  html
   body 
    form#test-form(action='', method='post')
                                      ^  
      select#menu1(name='menu1', size=projectPathArray.length)
        each val in projectPathArray
          option=val
      button(type='submit') Submit

如何将变量从 Jade 传递到 .JS 文件？

How to pass variable from Jade to .JS file?

javascript

client-server

node.js

pug