Typescript / Javascript：带有主题，正文和链接数组的mailto

Question

我使用Angular4。在单击超链接时，我必须打开Outlook，在邮件中，我必须发送4个链接。因此，我计划mailto从我的打字稿文件中调用a 。我的代码是

    <span (click)="mailMe()">Mail me the links</span>


    var links= ["link1.com", "link2.com", "link3.com"];
    mailMe(){
        console.log("111111");
        var mail = document.createElement("a");
        console.log("22222");
        mail.href = "mailto:abc@abc.com?subject=files&body=Hi";
        mail.click();
    }

我可以调用该函数，但邮件不会弹出。在控制台111111中正在打印但未22222打印。我哪里做错了？还是有一种方法可以从HTML本身发送链接数组？

Answer 1

您可以在IE中一个简单的实现这一目标window.location.href的IE浏览器有一些怪异的行为mailto。在这里我使用的是相同的<span>，从与你的代码links阵列。

IE 的示例代码：

import { Component} from '@angular/core';

@Component({
  selector: 'app-root',
  template: `
     <span (click)="mailMe()">Mail me the links on (click)</span>
  `
})
export class AppComponent {
  name = 'test';
  links : any[]= ["link1.com", "link2.com", "link3.com"];

  mailText:string = "";

  mailMe(){
    this.mailText = "mailto:abc@abc.com+?subject=files&body="+this.links.join(" ,"); // add the links to body
    window.location.href = this.mailText;
  }

}

下面的示例可能无法在 IE 中运行，但已在 Chrome 中进行了测试。在这里，我使用了锚标记并href在打字稿中设置了属性。

Chrome 和其他示例

import { Component,OnInit } from '@angular/core';

@Component({
  selector: 'app-root',
  template: `
     <a [href]="mailText">Mail me the links</a> <br>
  `
})
export class AppComponent implements OnInit {
  name = 'test';
  links : any[]= ["link1.com", "link2.com", "link3.com"];

  mailText:string = "";


  ngOnInit(){
    this.mailText = "mailto:abc@abc.com+?subject=files&body="+this.links.join(" ,");
  }

}

这是一个工作演示：https : //stackblitz.com/edit/attribute-binding-1-7wncwf

Answer 2

you want to achieve like this

<a href="mailto:xyz@example.com?Subject=Hello&body=links:  %0D 
         http://link1.com  %0D http://link1.com " target="_top">Send Mail</a>

in angular you can do it like this , in html

<a [href]="emailstring" target="_top"></a>

in ts file do like this

 emailstring= "mailto:xyz@example.com?Subject=Hello&body=links:  %0D 
             http://link1.com  %0D http://link1.com";

Haven't tested with angular but check it with pure html. and its working on chrome.