带呼叫选项的Angular 6电话号码

Question

在angularJs中，您可以使用HTML5功能将电话号码绑定到HTML，以单击它以触发呼叫该电话，如下所示：

<a href="tel:{{location.phoneNumber}}">{{location.phoneNumber | phoneFilter}}</a>

您如何在Angular 6中做到这一点？我尝试了以下操作，但会引发错误：

<a [href]="tel:{{l.phoneNumber}}">{{l.phoneNumber}}</a>

Answer 1

您可以在Angular中使用模板绑定语法{{...}}进行相同的操作，或者在使用属性绑定[href]="..."时使用字符串串联。例子：

<a href="tel:{{location.phoneNumber}}">{{location.phoneNumber | phoneFilter}}</a>
<a [href]="'tel:' + location.phoneNumber">{{location.phoneNumber | phoneFilter}}</a>

Demo

Answer 2

尝试将其更改为：

<a href={{'tel:'+l.phoneNumber}}>{{l.phoneNumber}}</a>