僅當變量值不為空/未定義/空時才顯示 html email 模板元素

Question

我在 email 中使用 mailgun，並在 node.js 中使用 html 作為模板。 我只想在變量有效時顯示 html 標簽。

下面是我的 function 我正在替換變量值的地方。

exports.sendParentReservation = async function(data) {
   let template = await loadTemplate(parentReservation);
   let embeddedLogo = await loadLogo();

   // > PARENT DATA: parent name, kid name, service name, company name, group name, reservation date,price

   template = template.replace(/{{action_url}}/g, parentReservationsLink);
   template = template.replace(/{{parent_name}}/g, data.parentName);
   template = template.replace(/{{nextStep}}/g, data.nextStep);

   mailer.sendMail({
    from: '...',
    to: data.recipient,
    subject: "Your reservation on ...",
    html: template,
    attachments: [{
        cid: 'logo.png',
        content: embeddedLogo,
        encoding: 'base64'
    }],
   }, (err, info) => {
    if (err) {
        console.log(`Error: ${err}`);
    }
    else {
        console.log("Mailgun Response: " + JSON.stringify(info,null,4));
    }
 });
};

下面是我的 html email 模板代碼

<table class="attributes" width="100%" cellpadding="0" cellspacing="0" role="presentation">
    <tr>
        <td class="attributes_content">
          <table width="100%" cellpadding="0" cellspacing="0" role="presentation">
            <tr>
             <td class="attributes_item"><span class="f-fallback"><strong>Instructions - Next/Steps</strong></span></td>
            </tr>
            <tr>
              <td class="attributes_item">{{nextStep}}</td>
            </tr>
          </table>
        </td>
    </tr>
 </table>

如果nextStep為null/undefined or empty ，我想隱藏 html 代碼上方的所有這些。

下面是我的 email 模板的屏幕截圖，我突出顯示了我想在屏幕截圖中隱藏的部分。

Answer 1

你應該能夠做到這一點：

 <script>
      if (nextStep != null) {
      document.write('<table class="attributes" width="100%" cellpadding="0" cellspacing="0" role="presentation">    <tr>        <td class="attributes_content">          <table width="100%" cellpadding="0" cellspacing="0" role="presentation">            <tr>             <td class="attributes_item"><span class="f-fallback"><strong>Instructions - Next/Steps</strong></span></td>            </tr>            <tr>              <td class="attributes_item">{{nextStep}}</td>            </tr>          </table>        </td>    </tr> </table>') 
      }
</script>