如何使用HTML5，JS或Angular工作在Ionic中验证电子邮件? [英] How can I make validation of email in Ionic using HTML5, JS or Angular work?

问题描述

我注意到这是种痛苦.带有type ="email"的HTML5验证程序似乎无法在Ionic(View)中使用.我尝试了所有可能的方法，但是没有用.

I have noticed that this is a pain in the ass. The HTML5 validator with type="email" seems like it's not working in Ionic (View). I tried every possible way, but it's not working.

我正在使用:

• 离子(查看)

• Ionic (View)

角度

HTML5

这是我现在的HTML:

This is my HTML right now:

<input class="testinput" type="email" name="email"
       ng-model="userRegistration.email" type="text"
       pattern="/^[_a-z0-9]+(\.[_a-z0-9]+)*@[a-z0-9-]*\.([a-z]{2,4})$/" 
       required>

也尝试使用 type ="text" 进行此操作，但也无法正常工作.我可以在使用诸如"blablabla" 这样的电子邮件地址时验证表单，在这里我不使用 @ 符号，这当然是错误的.

Also tried this with type="text", but also not working. I can just validate the form while I am using an e-mailadress like: "blablabla" where I don't use a @ symbol, which is wrong, of course.

我也这样尝试过的是: [a-z0-9 ._％+-] + @ [a-z0-9 .-] + \.[az] {2,63} $ 和 ng-pattern ，但是我没有收到错误，我可以注册随机文本，而不会被验证者阻止.

What I also so tried, is: [a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,63}$ and ng-pattern, yet I don't get an error and I can just register with random texts, without being stopped by the validators.

所以我的问题是:我该如何解决?解决此问题的最佳方法是什么?

So my question is: how can I fix this? What is the best way to fix this?

我已检查:

• 如何使用ng验证angularJs中的电子邮件ID-模式
• 为什么HTML5表单验证允许电子邮件中没有一个点?

推荐答案

我自己修复了它.所有其他可能的解决方案都不适合我.不过，这一项可行:

I fixed it myself. All other possible solutions were not working for me. This one works, though:

<input type="email" name="email" ng-model="someModelIamUsing"
       pattern="[A-Za-z0-9._%+-]{3,}@[a-zA-Z]{3,}([.]{1}[a-zA-Z]{2,}|[.]{1}[a-zA-Z]{2,}[.]{1}[a-zA-Z]{2,})">

也许其他人也可以从中受益，这就是为什么我在这里添加它.

Perhaps others can benefit from this too, that's why I am adding it here.

这篇关于如何使用HTML5，JS或Angular工作在Ionic中验证电子邮件?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！