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>');

和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

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

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

因此模板不能迭代缺失的值。

Answer 3

您也可以使用ES6箭头功能样式进行此操作：

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

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

3 个答案: