CODEWITHSUNDEEP
angularhtml
devC
devC

Reputation: 1444

Angular 6 telephone number with call option

In angularJs, you can bind a telephone number to your HTML with the HTML5 feature to click it to trigger calling the number, as follows:

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

How do you do this in Angular 6? I tried the following but it throws me an error:

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

Upvotes: 1

Views: 3324

Answers (2)

Teddy Sterne
Teddy Sterne

Reputation: 14221

You can do it the same way in Angular with the template binding syntax {{...}} or by using string concatenation when using the attribute binding [href]="...". Examples:

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

Demo

Upvotes: 4

A. Meshu
A. Meshu

Reputation: 4148

Try change it to: 

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

Upvotes: 1

Related Questions