如何在javascript函数中使用已传递到pug模板中的数组而不进行拆分？

我有一个CRUD.js文件，用于将一些变量（包括数组）传递到名为list.pug的pug模板中：

router.get('/', async (req, res) => {
  let {projects, nextPageToken} = await db.list(10, req.query.pageToken);
  let customers = ["John", "Mary", "Mark"];

  res.render('projects/list.pug', {
    projects,
    nextPageToken,
    customers,
  });
});

然后在pug文件中，我试图通过循环这些数组，使用javascript构建一个表。然而，当我这样做时，似乎客户并没有被看作是一个字符串数组，而是被看作一个字符串（在尝试循环项目时也会出现类似的问题）。下面是带有javascript的pug模板：

  select(name="customerDropdown", id="customerDropdown" class="btn btn-success dropdown-toggle" onChange="changeEvent()")
    each customer in customers 
      option=customer

  each project in projects
      .media
        a(href=`/projects/${project.id}`)
          .media-body
            h4= "Customer: " + project.customer
            p= "Project manager: " + project.manager

  if !projects.length
    p No projects found.

  if nextPageToken
    nav
      ul.pager
        li
          a(href=`?pageToken=${encodeURIComponent(nextPageToken)}`) More
 script.
    let projects = "!{projects}"
    let customers = "!{customers}"

    console.log(customers.length)
    for (var i = 0; i < customers.length; i++){
      console.log(customers[i])
    }

选择（name=“customerDropdown”，id=“customerDropdown”class=“btn btn成功下拉切换”onChange=“changeEvent（）”）
客户中的每个客户
选项=客户
项目中的每个项目
媒体
a（href=`/projects/${project.id}`）
.媒体机构
h4=“客户：”+project.Customer
p=“项目经理：”+项目经理
如果！项目长度
p未找到任何项目。
如果下一个开始
导航
传呼机
锂
（href=`？pageToken=${encodeURIComponent（nextPageToken）}`）更多
剧本
let projects=“！{projects}”
let customers=“！{customers}”
console.log（customers.length）
对于（变量i=0；i

---

此代码导致打印出客户的每个单独字符（即“J”、“O”、“H”、“N”、“i”、“M”等），而不是“John”、“Mary”、“Mark”，尽管“customerDropdown”中的“customer in customers”循环工作正常。我试图使用这个数组来动态更新页面，那么如何将它作为原始数组而不是字符串/字符数组拉入JS函数？感谢您的帮助

为了将数组从Pug传递到客户端javascript，需要在插值过程中删除引号并使用

JSON.stringify（）

，如下所示：

script.
  let projects  = !{JSON.stringify(projects)}
  let customers = !{JSON.stringify(customers)}