Is there an ng-model and input type email bug?

后端 未结 4 1435
执笔经年
执笔经年 2021-02-07 05:58

Is there something special going on with input type=\"email\" and ng-model attribute? If the input is email, then the model doesnt update. If I change the input type to text, nu

相关标签:
4条回答
  • 2021-02-07 06:22

    A complement, you can use properties on you form to see if your email is valid, like this :

    HTML:

    <form name="myForm" ng-submit="submit()">
        <input type="email" ng-model="email1" name="email1" />
    </form>
    

    Javascript:

    //[formName].[inputFieldName].property 
    myForm.email1.$pristine;
    // Boolean. True if the user has not yet modified the form.
    myForm.email1.$dirty
    // Boolean. True if the user has already modified the form.
    myForm.email1.$valid
    // Boolean.True if the the form passes the validation.
    myForm.email1.$invalid
    // Boolean. True if the the form doesn't pass the validation.
    myForm.email1.$error
    

    Reference

    0 讨论(0)
  • 2021-02-07 06:26

    Starting from Angular 1.3, you can easily overwrite the 'email' validator and make it always return true.

    angular
      .module('myApp', [])
      .controller('MainController', function() {
        this.email = '';
      })
      .directive('noEmailValidation', function() {
        return {
          restrict: 'A',
          require: 'ngModel',
          link: function(scope, elm, attr, ctrl) {
            ctrl.$validators['email'] = function() {
              return true;
            };
          }
        }
      });
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js"></script>
    <div ng-app="myApp">
      <form ng-controller="MainController as main">
        <div>Email: {{main.email}}</div>
        <input type="email" ng-model="main.email" no-email-validation>
      </form>
    </div>

    Enjoy.

    0 讨论(0)
  • 2021-02-07 06:35

    It's not a bug, it's only update when we type correct email address format for email validation. Add this attribute ng-model-options="{'allowInvalid': true}" to allow invalid email input.

    0 讨论(0)
  • It does some validation on then input, so you need to have entered a valid email address before it is bound to the model.

    This is the regex that is used:

    /^[A-Za-z0-9._%+-]+@[A-Za-z0-9.-]+\.[A-Za-z]{2,4}$/
    

    Basically you need to input an address that is at least a@b.co

    0 讨论(0)
提交回复
热议问题