当前位置: 首页 > 知识库问答 >
问题:

如何使用ng-pattern在angularJs中验证电子邮件id

鱼志诚
2023-03-14

但我对Angularjs是新的。我需要显示一个错误消息,一旦用户输入错误的电子邮件ID。

我下面的代码是试图解决的。帮助我使用ng-pattern得到正确的结果。

<script type="text/javascript" src="/Login/script/ang.js"></script>
<script type="text/javascript">
    function Ctrl($scope) {
        $scope.text = 'enter email';
        $scope.word = /^[a-z]+[a-z0-9._]+@[a-z]+\.[a-z.]{2,5}$/;
    }
</script>
    </head>
<body>
    <form name="myform" ng-controller="Ctrl">
        <input type="text" ng-pattern="word" name="email">
        <span class="error" ng-show="myform.email.$error.pattern">
            invalid email!
        </span>
        <input type="submit" value="submit">
    </form>
</body>

共有1个答案

宗弘扬
2023-03-14

如果您想验证电子邮件,那么请使用带有type=“email”而不是type=“text”的input。AngularJS具有开箱即用的电子邮件验证功能,因此无需为此使用ng-pattern。

以下是原始文档中的示例:

<script>
function Ctrl($scope) {
  $scope.text = 'me@example.com';
}
</script>
<form name="myForm" ng-controller="Ctrl">
  Email: <input type="email" name="input" ng-model="text" required>
  <br/>
  <span class="error" ng-show="myForm.input.$error.required">
    Required!</span>
  <span class="error" ng-show="myForm.input.$error.email">
    Not valid email!</span>
  <br>
  <tt>text = {{text}}</tt><br/>
  <tt>myForm.input.$valid = {{myForm.input.$valid}}</tt><br/>
  <tt>myForm.input.$error = {{myForm.input.$error}}</tt><br/>
  <tt>myForm.$valid = {{myForm.$valid}}</tt><br/>
  <tt>myForm.$error.required = {{!!myForm.$error.required}}</tt><br/>
  <tt>myForm.$error.email = {{!!myForm.$error.email}}</tt><br/>
</form>

有关详细信息,请阅读以下文档:https://docs.angularjs.org/api/ng/input/input%5bemail%5d

<script>
function Ctrl($scope) {
  $scope.text = 'me@example.com';
  $scope.emailFormat = /^[a-z]+[a-z0-9._]+@[a-z]+\.[a-z.]{2,5}$/;
}
</script>
<form name="myForm" ng-controller="Ctrl">
  Email: <input type="email" name="input" ng-model="text" ng-pattern="emailFormat" required>
  <br/><br/>
  <span class="error" ng-show="myForm.input.$error.required">
    Required!
  </span><br/>
  <span class="error" ng-show="myForm.input.$error.pattern">
    Not valid email!
  </span>
  <br><br>
  <tt>text = {{text}}</tt><br/>
  <tt>myForm.input.$valid = {{myForm.input.$valid}}</tt><br/>
  <tt>myForm.input.$error = {{myForm.input.$error}}</tt><br/>
  <tt>myForm.$valid = {{myForm.$valid}}</tt><br/>
  <tt>myForm.$error.required = {{!!myForm.$error.required}}</tt><br/>
  <tt>myForm.$error.pattern = {{!!myForm.$error.pattern}}</tt><br/>
</form>
 类似资料:
  • 问题内容: 我正在尝试使用ng-pattern指令验证angularJs中的Email id字段。 但是对AngularJs来说是新手。用户输入错误的电子邮件ID后,我需要立即显示错误消息。 我下面的代码正在尝试解决。使用ng-pattern帮助我获得正确的结果。 问题答案: 如果要验证电子邮件,请使用type =“ email”而不是type =“ text”的输入。AngularJS具有开箱即

  • 问题内容: 我如何使用php5验证输入值是有效的电子邮件地址。现在我正在使用此代码 但显示已弃用的错误。我该如何解决此问题。请帮我。 问题答案: 您可以使用该功能,该功能为您提供了许多方便的验证和消毒选项。 PHP手册filter_var() 在 PHP > = 5.2.0中*可用 * 如果您不想更改依赖于函数的代码,请执行以下操作: 注意 :对于其他用途(需要Regex的地方),不赞成使用的函数

  • 每当我在Firebase中使用电子邮件/密码身份验证提供程序时,提供程序都会在成功注册时发送一个无记名令牌,即使是。是否有一种开箱即用的方法将电子邮件/密码身份验证提供程序配置为在用户验证其电子邮件地址之前不发送无记名令牌(并返回403错误)? 请注意,我知道如何创建用户、登录用户、发送验证电子邮件等。。。使用firebase v9。x通过firebase/auth中的方法创建用户(使用Email

  • 我正在提示我的应用程序用户提供电子邮件凭据。 在用户插入电子邮件并通过后,我想验证该帐户。 我正在使用javax。邮政有没有办法验证帐户?只确保凭据确实有效——否则我想显示一个无效用户并传递消息。 也许是某种表演方式: 并在不发送任何内容的情况下检查身份验证异常。

  • 问题内容: 是否有正则表达式来验证JavaScript中的电子邮件地址? 问题答案: 使用正则表达式可能是最好的方法。您可以在此处看到很多测试(taken from chromium) 这是接受unicode的常规表达式的示例: 但是请记住,不应该只依赖JavaScript验证。可以轻松禁用JavaScript。这也应该在服务器端进行验证。 这是上述操作的一个示例:

  • 我有一张登记表,上面有姓名、电子邮件和密码。注册时,会向用户的电子邮件地址发送一个确认链接。但在发送链接之前,我需要验证电子邮件地址。我使用了: 它显示的任何电子邮件都有效,例如, 我从获得的电子邮件并将其存储在中。 我到底要怎么做才能让它成功?