Как перебирать объекты внутри массива в Lodash
Я пытаюсь использовать lodash внутри HTML-шаблона для электронной почты в Node.js. У меня есть один массив с несколькими объектами. Я хотел бы перебирать каждый объект и перечислить все повторяющиеся значения. Когда я использую приведенный ниже код, я получаю сообщение об ошибке, указывающее, что значение undefined (например, 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,
}
]
Ответы
Ответ 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
Ответ 2
Это потому, что вы даете orderInfo[0]
вашему шаблону. И в вашем массиве orderInfo[0]
- это только эта часть:
{
"firstName": "John",
"lastName": "Doe",
"address": "123 Broadway",
"city": "New York",
"state": {
"code": "NY",
"state": "New York"
},
"zip": "10001",
}
Таким образом, шаблон не может перебирать отсутствующие значения.
Ответ 3
Вы также можете сделать это в стиле функции стрелки ES6:
const users = ['Jack', 'Jill']; _.forEach(users, user => {console.log(user);});