How to iterate through objects within array in Lodash

Question

I'm trying to use lodash within an HTML template for an email in Node.js. I have one array with several objects. I would like to iterate through each object and list all of the repeating values. When I use the code below, I receive an error stating that the value is undefined (e.g., ReferenceError: firstName is not defined). The HTML template is in a separate file.

Any thoughts on what I'm doing wrong?

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><% }); %>

Array:

[
  {
    "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,
  }
]

Are these templates EJS? If so, please tag your question accordingly. — mik01aj
– mik01aj, Commented Oct 8, 2015 at 11:28

Haseeb Asif · Accepted Answer · 2015-10-11 11:50:36Z

18

+25

There are couple of things wrong here actually. Starting with template syntax, you are only specifying the iterator to foreach in your template but we need data and iterator both something as follows

_.forEach(users, function(user){

Also you have multiple objects in single array position so I have update the json structure a little bit as well.

After minor updates template something like this with some property missing intentionally,

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

and json with orders arrays in same object is as follows

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,
        }
  ]  
  } 
]
};

You can see it working on here at JSBIN

answered Oct 11, 2015 at 11:50

Haseeb Asif

1,8062 gold badges25 silver badges44 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Ken Over a year ago

Is it necessary to change the json structure in order for this to work?

Haseeb Asif Over a year ago

no it isn't but I am not sure how you can have multiple objects at single array position, If that's possible I will be happy to know. Other thing you can do is create a one big object with named objects in it but again you never know how many objects a single order can contain

John Meyer · Accepted Answer · 2019-07-02 20:52:51Z

2

You can also do this in ES6 arrow function style:

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

answered Jul 2, 2019 at 20:52

John Meyer

2,3661 gold badge32 silver badges39 bronze badges

Comments

Magus · Accepted Answer · 2015-10-08 08:19:02Z

1

It's because you give orderInfo[0] to your template. And in your array, orderInfo[0] is just this part :

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

So the template can't iterate on the missing values.

answered Oct 8, 2015 at 8:19

Magus

15.1k4 gold badges40 silver badges52 bronze badges

3 Comments

Ken Over a year ago

Thanks for pointing that out. But I must be doing something else wrong as well. Because when I remove the [0] nothing is displayed for the item and cost values.

Magus Over a year ago

If you remove tne [0] you are giving the entire array to your template so you have to change your template

Ken Over a year ago

I've updated my template but I'm still not able to iterate through and get the respective values. Any suggestions?

Collectives™ on Stack Overflow

How to iterate through objects within array in Lodash

3 Answers 3

2 Comments

Comments

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related