Question

我正在尝试使用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}

我已经阅读了有关在这里使用jade迭代的所有内容：http://jade-lang.com/reference/iteration/，但我似乎无法正确地迭代对象数组以获取所有值。

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

Answer 1

试试这段代码：

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

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

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

Answer 2

问题似乎是，当您不需要时，您正在为个人联系人建立索引：contact[0].name。

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

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

使用Express和Jade迭代一组对象

2 个答案: