如何在 Lodash 中遍历数组中的对象

Question

我正在尝试在 HTML 模板中使用 lodash 来处理 Node.js 中的电子邮件。我有一个包含多个对象的数组。我想遍历每个对象并列出所有重复值。当我使用下面的代码时，我收到一条错误消息，指出该值未定义（例如，ReferenceError: firstName is not defined）。 HTML 模板位于单独的文件中。

对我做错了什么有什么想法吗？

Javascript：

var template = fs.readFileSync('server/views/email-template.html').toString();
var htmlAll = _.template(template)(orderInfo);

HTML：

<% _.forEach(function(firstName) { %><%- firstName %></td><% }); %> <% _.forEach(function(lastName) { %><%- lastName %></td><% }); %>
<% _.forEach(function(address) { %><%- address %></td><% });%>
<% _.forEach(function(city) { %><%- city %><% }); %>, <% _.forEach(function(state.code) { %><%- state.code %><% });
%> <% _.forEach(function(zip) { %><%- zip %><% }); %>

<% _.forEach(function(item) { %><td><%- item %></td><% }); %>
<% _.forEach(function(cost) { %><td><%- cost %></td><% }); %>

数组：

[
  {
    "firstName": "John",
    "lastName": "Doe",
    "address": "123 Broadway",
    "city": "New York",
    "state": {
      "code": "NY",
      "state": "New York"
    },
    "zip": "10001",
  },

  {
    "color": "White",
    "size": "M",   
    "item": "T-Shirt",
    "cost": 19.99,
  },
  {
    "color": "Blue",
    "size": "L",   
    "item": "T-Shirt",
    "cost": 19.99,
  }
]

Answer 1

实际上这里有几件事是错误的。从模板语法开始，您只需要在模板中指定要 foreach 的迭代器，但我们需要数据和迭代器，如下所示

_.forEach(users, function(user){

此外，您在单个数组位置有多个对象，所以我也稍微更新了 json 结构。

在像这样的小更新模板之后故意丢失了一些属性，

var tmpl = _.template('<ul><% _.forEach(users, function(user) { %><li><%- user.firstName %></li><li><%- user.address %></li><li><%- user.state.code %></li><li><%- user.state.state %></li><ol> <% _.forEach(user.orders, function(order) { %> <li><span><%- order.item %><span> cost is: <span><%- order.cost %><span></li> <% }); %> </ol> <% }); %></ul>');

同一个对象中带有orders数组的json如下

var data = { 'users': 

        [
  {
    "firstName": "John",
    "lastName": "Doe",
    "address": "123 Broadway",
    "city": "New York",
    "state": {
      "code": "NY",
      "state": "New York"
    },
    "zip": "10001",
    "orders": [
        {
            "color": "White",
            "size": "M",   
            "item": "T-Shirt",
            "cost": 19.99,
        },
        {
            "color": "Blue",
            "size": "L",   
            "item": "Pant",
            "cost": 19.99,
        }
  ]  
  } 
]
};

你可以在JSBIN看到它正在工作

Answer 2

您也可以在 ES6 箭头函数样式中执行此操作：

const users = ['Jack', 'Jill']; _.forEach(users, user => {console.log(user);});

Answer 3

这是因为您将orderInfo[0] 提供给您的模板。在您的数组中，orderInfo[0] 就是这一部分：

{
    "firstName": "John",
    "lastName": "Doe",
    "address": "123 Broadway",
    "city": "New York",
    "state": {
      "code": "NY",
      "state": "New York"
    },
    "zip": "10001",
}

因此模板无法迭代缺失值。