Alexandru R
Alexandru R

Reputation: 8823

How to use Angular input fields email validation inside controller?

I'm trying to validate a variable as email inside Angular controller.

var valid = $filter('email')($scope.email);

The email filter doesn't exists, generates "unknown provider error". What's the correct way to access email validation from inside the controller?

Thanks.

Later edit: don't put me to create a custom filter, it must be a way using angular validation.

Upvotes: 7

Views: 8805

Answers (3)

kazuar
kazuar

Reputation: 1154

You can create a hidden input type email:

<input type="email" hidden id="emailValidator" required ng-model="x" />

Then in js set the value to that input and check validity:

var validator = $('#emailValidator')[0];
validator.value = "[email protected]";

return validator.checkValidity();

Also this documentation could be helpful: https://docs.angularjs.org/guide/forms

Upvotes: 7

Khanh TO
Khanh TO

Reputation: 48972

You could use form and prevent form submission by adding ng-disabled to the submit button:

<form name="form">
      <input type="email" ng-model="email" name="email" required/>
      <button type="submit"
        ng-disabled="form.$invalid">Submit</button>
</form>

{{form.email.$valid}}

As the point of validation is to prevent submission and show error messages. I think it's enough to do it there instead of controllers where you handle your business logic.

DEMO

Upvotes: 4

Engineer
Engineer

Reputation: 48793

You can write your own filter:

angular.module(/**some module description here**/).
   filter('email',function(){
       var validateEmail = function(email) { 
            var re = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
            return re.test(email);
       }
       return function(input){
            return validateEmail(input); 
       };
   });

Regular expression is borrowed from here

Upvotes: 3

Related Questions