Отправить сообщение в зависимости от длины массива

Question

У меня проблема с примером документа в базе данных mon go atlas:

{
    "_id": {
        "$oid": "5e517a946364cc48f0ccf1e7"
    },
    "firstName": "checkout1",
    "lastName": "",
    "companyName": "",
    "phoneNumber": null,
    "email": "exampleemail@gmail.com",
    "country": "",
    "adress": "",
    "postcode": "",
    "userId": "5daf414818d091616a0d917e",
    "orderedItems": [{
        "_id": "5e03b2072e0c98b9fa62388c",
        "id": 3,
        "title": "Blue shoes",
        "img1": "product4/1.jpg",
        "img2": "product4/2.jpg",
        "cost": 70,
        "color": "blue",
        "quantity": 5
    }],
    "createdAt": {
        "$date": "2020-02-22T19:01:40.228Z"
    },
    "updatedAt": {
        "$date": "2020-02-22T19:01:40.228Z"
    },
    "__v": 0
}

Я хочу отправить сообщение с подтверждением о приобретенных товарах и их количестве, как показано ниже:

...

    const {
       ...
email,
      orderedItems
    } = req.body;
    var user = await User.findOne({ email: email });
    let newCheckout = await Checkout.create({

      ...
      email,
      ...
      orderedItems,
      userId: user._id
    });
    const htmlEmail = `
    <div>Title of first ordered item: ${newCheckout.orderedItems[0].title}</div>
    `;

    const mailOptions = {
      from: process.env.MY_TEST_EMAIL_ADRESS,
      to: process.env.MY_EMAIL_ADRESS,
      subject: 'new message',
      replyTo: process.env.MY_EMAIL_ADRESS,
      text: process.env.MY_TEST_EMAIL_ADRESS,
      html: htmlEmail
    };
    transporter.sendMail(mailOptions, (err, info) => {});

...

Мне нужна эта часть кода:

const htmlEmail = `
        <div>Title of first ordered item: ${newCheckout.orderedItems[0].title}</div>
        `;

Чтобы отобразить ее как в React, где я может сопоставить массив orderItems с элементами div, поэтому в итоге сообщение будет выглядеть примерно так (пользователь получит все заказанные заголовки элементов, а количество элементов div будет зависеть от длины массива):

<div>Item: ${newCheckout.orderedItems[0].title}</div>
<div>Item: ${newCheckout.orderedItems[1].title}</div>
<div>Item: ${newCheckout.orderedItems[2].title}</div>

Мой главный вопрос: можно ли обойтись без шаблонизаторов, таких как Jade, Pug, Mustache?

Answer 1

Да.

orderedItems.map(item => `<div>Item: ${item.title}</div>`).join()

Когда вы обнаружите, что возвращаетесь в StackOverflow, чтобы спросить о следующем шаге в создании собственного пользовательского движка рендеринга, найдите минутку, чтобы взглянуть на Knockout .

Это сэкономит ваше время в долгосрочной перспективе, потому что вы захотите сделать больше и больше настроек, и вскоре вы потратили больше времени на взлом, чем на рендерере.

Knockout - это просто, и вы отправляете объект JSON, который отображается на клиенте, и вы можете легко и быстро вносить изменения в макет. Вы будете любить это.

Answer 2

Шаблонные движки не обязательны, просто итерируйте по orderedItems:

const htmlMail = newCheckout.orderedItems.map(i => `<div>Item: ${i.title}</div>`).join('')