Ng-href with mailto isn't working consistently

[wlingke]

Let me preface this issue by saying that I am not sure if this issue is specific to my setup and would like to hear if anyone else is seeing this issue.

I am using the Chrome Version 33.0.1750.154 m and I just noticed this issue though I can't really say for certain when it began occurring since I have not changed anything major in my app - which is using angular v1.2.9 - for quite a while.

When I click on a link such as the below

//where some_email is 'test@gmail.com'
<a ng-href="mailto:{{some_email}}" target="_blank">test</a> 

I expect a new tab to open up and direct to my gmail (which is the case for normal mailto anchor tags). However, with the above, that only occurs some of the time and most of the time, it opens up a new tag with the address bar filled in as mailto:test@gmail.com

If I inspect the html, when it works it will show an event handler on the tag:

onclick="window.open('https://mail.google.com/mail/?view=cm&tf=1&to=test@gmail.com&cc=&bcc=&su=&body=','_blank');return false;"

and when it doesn't work as expected, that handler is not there.

Thanks for the help.

[wlingke]

After some more exploration, I've discovered that this tends to happen when the tag is compiled after the page has loaded.

For instance in this plunkr, I show two links. The first one is rendered immediately. The second is rendered after 500ms goes by. The first mailto works as expected while the second does not.
http://plnkr.co/edit/uARv1g1SKZ9HD5RRJKYw?p=preview

[caitp]

Both links in this plnkr are working (safari 7). Maybe a browser bug?

Sent from my iPad

On Apr 2, 2014, at 8:11 PM, Lingke Wang notifications@github.com wrote:

After some more exploration, I've discovered that this tends to happen when the tag is compiled after the page has loaded.

For instance in this plunkr, I show two links. The first one is rendered immediately. The second is rendered after 500ms goes by. The first mailto works as expected while the second does not.
http://plnkr.co/edit/uARv1g1SKZ9HD5RRJKYw?p=preview

—
Reply to this email directly or view it on GitHub.

[wlingke]

Hmm also works for me in safari. This is likely a chrome issue then...

[kylebarrow]

We've tracked the issue in IE8 and IE9 only. It seems this bug was recently(ish) introduced as we have products running 1.2.13 that don't produce this bug, but 1.2.21 updates do.

[wlingke]

This doesn't seem to be a problem in chrome anymore.

[mruoss]

Did anyone find a solution to this problem? I face it in IE9 - angular 1.2.15

[mruoss]

As workaround I now added target="_self" to the element. Now the mailto-links open correctly.

[istvanpuskas]

This still seems to be a problem. _self workaround does not work for me
angular v1.3.13
chrome 41.0.2272.101 m

[czebe]

It's not working for me either (nothing happens, no errors).
Angular 1.3.14
Chrome on Mac, version 42.0.2311.90 (64-bit)

---

FIXED:
I had a pipe character (|) in the subject, so this is most likely an urlencoding problem with Chrome

[Narretz]

I assume this was a Chrome bug that has been fixed in the meantime.

[jiggy2204]

Sorry, I know I'm waaaaaaaaaaay late - I also had this issue and noticed I was doing a ng-href="mailto: {{email}}"; the way I fixed the issue was to put the entire line in {{email}}:

in export Component{
email = "mailto:name@email.com";
}

Then in the html:
a ng-href="{{ email }}

Hope this helps some people.