首页 > 解决方案 > 是否可以将表格从模板传递到电子邮件正文?

问题描述

我必须将数据从模板传递到电子邮件正文。有可能还是我该如何解决?

我有这个清单

<ion-list>
      <ion-item>
        <ion-row>
          <ion-col size="3">
            <label>MARCA</label>
          </ion-col>
          <ion-col size="4">
            <label>PRODUCTO</label>
          </ion-col>
          <ion-col size="3">
            <label>PRESENT.</label>
          </ion-col>
          <ion-col size="2">
            <label>CANT.</label>
          </ion-col>
        </ion-row>
      </ion-item>
      <ion-item *ngFor="let producto of productos">
          <ion-row>
            <ion-col size="3">
              <label>{{ producto.marca }}</label>
            </ion-col>
            <ion-col size="4">
              <label>{{ producto.producto }}</label>
            </ion-col>
            <ion-col size="3">
              <label>{{ producto.presentacion }}</label>
            </ion-col>
            <ion-col size="2">
              <label{{ producto.cantidad }}</label>
            </ion-col>
          </ion-row>
      </ion-item>
</ion-list>

表格结果

我想将此表传递给电子邮件正文,我正在使用社交共享插件发送电子邮件:

this.socialSharing.canShareViaEmail().then(() => {
        this.socialSharing.shareViaEmail(
        'HERE COMES THE BODY AND I WANT TO PUT HERE THE ion-list',
        'Subject',
        ['example@hotmail.com']).then(() => {
            // Success!
        });
      });

This is the plugin example!
this.socialSharing.shareViaEmail('Body', 'Subject', ['recipient@example.org']).then(() => {
  // Success!
})

标签: angularionic-frameworkionic4

解决方案


所以我不认为它只是将转换后的离子成分表输出到电子邮件友好的 html 模板中那么简单。但是你当然可以创建一个帮助脚本来为你做这件事。

如果您事先知道电子邮件的结构,则很容易创建一个简单的脚本,该脚本将遍历您的项目并将它们填充到您想要的电子邮件模板中。

我不会编写所有代码,但这里是我过去做过的一些事情的快速想法:


createHtmlTableRow = (producto) => `
          <tr>
            <td size="3">
              <label>${producto.marca}</label>
            </td>
            <td size="4">
              <label>${producto.producto}</label>
            </td>
            <td size="3">
              <label>${producto.presentacion}</label>
            </td>
            <td size="2">
              <label>${producto.cantidad}</label>
            </td>
          </tr>`;

createHtmlTemplate = (products) => {
    let emailTemplate: string = `<table>
      <thead>
        <tr>
          <th>
            <label>MARCA</label>
          </th>
          <th>
            <label>PRODUCTO</label>
          </th>
          <th>
            <label>PRESENT.</label>
          </th>
          <th>
            <label>CANT.</label>
          </th>
        </tr>
      </thead>
      <tbody>`;

    for (let product of products) {
        emailTemplate += this.createHtmlTableRow(product);
    }

    emailTemplate += '</tbody></table>';

    return emailTemplate;
}

...

this.socialSharing.canShareViaEmail().then(() => {
    this.socialSharing.shareViaEmail(this.createHtmlTemplate(producto), 'Subject', ['example@hotmail.com']).then(() => {
        // Success!
    });
});


推荐阅读