使用 Express 和 Jade 遍历对象数组答案

【问题标题】：Iterating over an array of objects using Express and Jade使用 Express 和 Jade 遍历对象数组
【发布时间】：2016-05-02 12:24:21
【问题描述】：

我正在尝试使用 Jade 渲染 html，并且我想遍历一个对象数组。对于每个对象，我想在 li 的一行上打印所有值。

这是我使用 express 的后端代码：

router.get('/', function(req, res, next) {
  fs.readFile('./contacts.json', function(err, data){
    if (err) return res.status(400).send(err);
    var contactArr = JSON.parse(data);
    res.render('contacts', {contactArr : contactArr});
  });
});

--contactArr 是 JSON 格式的对象数组，如下所示：

[{"name":"Jennifer","email":"jennifer@yahoo.com"},{"name":"Mike","email":"miker@yahoo.com"}]

这是我正在尝试制作的前端翡翠代码：

extends layout

block content
  ul
    each contact in #{contactArr}
      li #{contact[0].name}

我已在此处阅读了有关使用玉进行迭代的所有内容：http://jade-lang.com/reference/iteration/，但我似乎无法获得正确的语法来迭代对象数组以获取所有值。

更新：我意识到问题的一部分是我试图错误地引用contactArr。 #{ } 语法是不必要的。只是玉代码中的“contactArr”让我可以访问数组。但是，我仍在努力弄清楚如何遍历数组中每个对象的键。

【问题讨论】：

标签： node.js express pug

【解决方案1】：

问题似乎是您在不需要时将单个联系人编入索引：contact[0].name。

在 Jade each 循环中，您已经将每个单独的对象拉出为 contact，因此您应该可以只使用 contact.name。

另外，#{contactArr} 语法可能会导致问题 - 在each 循环中，您应该只能使用contactArr。

【讨论】：

【解决方案2】：

试试这个代码：

ul
  each contact in contactArr
    li
      each value, key in contact
        span= key + ': ' + value + ' '

在上面的sn-p中，key是字段的名称。因此，对于您的输入，它应该呈现如下内容：

姓名：Jennifer 电子邮件：jennifer@yahoo.com
姓名：Mike 电子邮件：miker@yahoo.com

【讨论】：