Angular中如何在*ngFor循环内绑定boss.email生成mailto链接

你写的[href]属性绑定语法不符合Angular模板规则：方括号绑定的引号内是标准JavaScript模板表达式，你写的mailto: + boss.email里，mailto:没有被单引号标记为字符串字面量，Angular会尝试从组件作用域查找名为mailto的变量，找不到就会生成无效链接。
另外你的a标签是空标签，没有可点击的文本内容，就算链接生成正确用户也没法触发点击。

两种方案二选一即可：

• 方案1：保留属性绑定写法，给固定前缀加单引号标记为字符串

<a [href]="'mailto:' + boss.email">发送邮件</a>

• 方案2：直接用普通属性+插值拼接，写法更简洁

<a href="mailto:{{boss.email}}">发送邮件</a>

<div  class="boss" *ngFor="let boss of bosses" >
    <div class="boss-text">
        <div class="boss-text-name">{{boss.name}} </div>
        <div>{{boss.email}}</div>
        <a href="mailto:{{boss.email}}">联系{{boss.name}}</a>
    </div>
</div>

内容的提问来源于stack exchange，提问作者Genis