CODEWITHSUNDEEP
angularjs
Mahajan344
Mahajan344

Reputation: 2550

show mailto link to name in angularjs

I am working on AngularJs app where I need to show Name of customer but it should mail to link with email to his email address. Eg : If name is Bob and email is [email protected] , then on click of Bob it should show mail to [email protected]

my html as as below

<div class="form-group mg-t20" ng-hide="!groupObj.accountExecutiveName">
            <label class="wd50p control-label left fw-norm">Account Executive:</label>
            <div class="wd48p blue-txt">
                {{groupObj.accountExecutiveName}}
            </div>
        </div>

I do have email property . Its groupObj.accountExecutiveEmail . How do i do this in html ?

Upvotes: 0

Views: 8348

Answers (5)

nimrod
nimrod

Reputation: 5732

Angular2+:

<a [href]="'mailto:' + groupObj.accountExecutiveEmail" target="_blank">Send mail</a>

Upvotes: 1

danii
danii

Reputation: 5703

The following code should work in your case:

<a ng-href="mailto:{{ groupObj.accountExecutiveEmail }}" target="_blank"> 
  {{ groupObj.accountExecutiveName }}
</a>

So your final HTML will look like this:

<div class="form-group mg-t20" ng-hide="!groupObj.accountExecutiveName">
    <label class="wd50p control-label left fw-norm">Account Executive:</label>
    <div class="wd48p blue-txt">
        <a ng-href="mailto:{{ groupObj.accountExecutiveEmail }}" target="_blank"> 
        {{ groupObj.accountExecutiveName }}
        </a>
    </div>
</div>

Cheers!

Upvotes: 3

DSchmidt
DSchmidt

Reputation: 1127

mailto: in an <a> tag is the way to go.

https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Email_links

<a href="mailto:[email protected]">Bob</a>

Upvotes: 2

AranS
AranS

Reputation: 1891

You can add something like this to your template:

 <a ng-href="mailto:{{groupObj.accountExecutiveEmail}}" target="_blank">
     {{groupObj.accountExecutiveName}} --> here will be the item's name
 </a>

Upvotes: 2

DAXaholic
DAXaholic

Reputation: 35388

Just use a mailto link

<a ng-href="mailto:{{groupObj.accountExecutiveEmail}}">Send email</a>

Upvotes: 1

Related Questions