Capture value of an email type field in angular js

Navigation
0

I have the following HTML code with AngularJS: 

<html ng-app> 
    //...
    <form name="myForm2">
        <input type="email" id="email" name="email" ng-model="formData.email" required/>
        <span ng-show="!myForm2.email.$error.required && myForm2.email.$error.email && myForm2.email.$dirty">invalid email {{formData.email}}</span>
    </form>
    //...
</html>

What I want is, if the user fills in the wrong email field, the message "invalid email value_pregnancy_no_field" appears.

It happens that the above code only returns the message "invalid email", I am not able to capture the value of the field.

What's wrong with the code above?

    
asked by anonymous 18.09.2014 / 17:15

1 answer

1

I have not found any part of the AngularJS documentation that talks about it, but its default behavior is to undefine the property bound to the input when it does not have a valid value .

This is discussed in this GitHub issue and in that discussion in Google Groups .

That is, if myForm2.email.$invalid is true, the formData.email variable will be set to undefined . You can view this in example .

Angular Solution 1.3.x

If you are using version 1.3.x of Angular, there is a solution using ng-model-options . Just set the allowInvalid property to true : 

<input type="email" id="email" name="email" ng-model-options="{allowInvalid: true}" ng-model="formData.email" required/>

This example demonstrates this workaround.

    
19.09.2014 / 01:43
LINQ with Left Join and Multiple Keys Copy SMS messages received by iPhone