如何将变量传递到 HTML 正文中答案

【问题标题】：How to pass variables into an HTML body如何将变量传递到 HTML 正文中
【发布时间】：2016-06-24 14:54:57
【问题描述】：

我创建了这个脚本，它允许我选择某种食物和份量，然后它会计算营养价值，将其添加到数据库中，在一天结束时将其汇总，然后给我发送一封电子邮件，其中包含概述。几乎一切正常，我只是无法将脚本中的一些变量传递到 HTML 格式的电子邮件中。

在下面的代码部分中，totals 是电子表格范围内的数据值。我希望calories、caloriesFromFat 和polyFat 的检索值替换电子邮件htmlBody 中的匹配文本。

 var calories = totals[0][25];
    var caloriesFromFat = totals[0][26];
    var polyFat = totals[0][27];
  }
//Sends email with summary
    MailApp.sendEmail({
     to: "user@example.com",
     subject: "Daily Intake Log",
     htmlBody:  <table style="width:100%">
  <tr>
    <td>Calories</td>
    <td>calories</td>       

  </tr>

  <tr>
    <td>Calories From Fat</td>
    <td>caloriesFromFat</td>        

  </tr>

  <tr>
    <td>PolyUnsaturated</td>
    <td>polyFat</td>        

  </tr>

</table>

   });

当我将变量calories、caloriesFromFat 和polyFat 的内容输出到日志时，它们都包含应有的数字。但是当我收到电子邮件时，它不会插入变量的内容，只是留下变量的名称，例如calories。

如何将计算值输入到我的电子邮件中？

【问题讨论】：

totals 是一个范围的数据值。当我将变量calories、caloriesFromFat 和polyFat 的内容输出到日志时，它们都包含它们应该包含的数字。但是，当我尝试在电子邮件正文中调用表格 html 标记之间的变量时，它只会输出“卡路里”而不是它实际包含的数据。
你认为你在做什么？这在问题中并不清楚 - 我猜代码没有帮助，因为没有魔法可以用变量的内容替换像 calories 这样的字符串。我们可以先解决您的问题，好吗？
你显示 htmlBody 被定义的方式不可能工作。你是怎么做到的？

标签： javascript html google-apps-script google-sheets web-applications

【解决方案1】：

HTML 必须是字符串（文本），您需要使用文本公式构建 HTML。 JavaScript 中的文本字符串用加号（连接）放在一起：

var tableHTML = '<table style="width:100%">' + //Note single quotes on ends
   "<tr><td>Calories</td><td>" +
   calories + 
   "</td></tr>" +
   "<tr><td>Calories From Fat</td><td>" + 
   caloriesFromFat + 
   "</td></tr>" +
   "<tr><td>PolyUnsaturated</td><td>" + 
   polyFat + 
  "</td></tr>" +
   "</table>";

如果在 HTML 属性中使用双引号，则在字符串的末尾使用单引号。然后只需使用电子邮件 HTML 的变量名称：

htmlBody: tableHTML

【讨论】：

谢谢！像往常一样，我知道这是一件简单的事情。

【解决方案2】：

假设您的电子邮件 HTML 正文位于项目中的单独文件中，您可以使用 Printing Scriptlets 优雅地完成此操作。

这是一个用于插入calories 值的打印脚本。请注意，语法将变量名包含在一个特殊标记中，<?= ?>：

<?=calories?>

要填写模板，首先使用HtmlService获取模板，然后将打印脚本中的变量作为模板的对象属性。

// get email template
var template = HtmlService
      .createTemplateFromFile('email');

// assign values to template printing scriptlets
template.calories = totals[0][25];
template.caloriesFromFat = totals[0][26];
template.polyFat = totals[0][27];

最终代码

代码.gs：

// Get my email address
var me = Session.getActiveUser().getEmail();

// get email template
var template = HtmlService
      .createTemplateFromFile('email');

// assign values to template printing scriptlets
template.calories = totals[0][25];
template.caloriesFromFat = totals[0][26];
template.polyFat = totals[0][27];

// evaluate template to generate HTML
var htmlBody = template.evaluate();

//Sends email with summary
MailApp.sendEmail({
  to: me,
  subject: "Daily Intake Log",
  htmlBody:  htmlBody
});

email.html

<!-- HTML Email body with printing scriptlets -->
<table style="width:100%">
  <tr>
    <td>Calories</td>
    <td><?=calories?></td>
  </tr>
  <tr>
    <td>Calories From Fat</td>
    <td><?=caloriesFromFat?></td>
  </tr>
  <tr>
    <td>PolyUnsaturated</td>
    <td><?=polyFat?></td>
  </tr>
</table>

【讨论】：