Link to home
Start Free TrialLog in
Avatar of Steve Hougom
Steve HougomFlag for United States of America

asked on

Angular. Problem with custom validator

I have a field that requires conditional validation.


If a certain dropdown value is chosen then I need the field to be required.  No problem with one field and custom validator.  Unfortunately its email field and I have to add pattern and standard email validators too and this is causing me a nightmare to implement.


Currently the following works for required:


  
 proofEmail: ['',conditionalValidator( (()=> this.isProofPDF === true),Validators.required)],

Open in new window


My conditionalValidator function here:


function conditionalValidator(condition: (()=> boolean), validator : ValidatorFn): ValidatorFn {
  return (control : AbstractControl):{[key:string]:any} => {
    if(! condition()){       return null;     }     return validator(control);   }

Open in new window


My html here:


 <input class="form-control" formControlName='proofEmail' id="proof-email">

Open in new window

So Im simply trying to add validators.email and validators.pattern(mypattern) 

here

User generated image


 but no matter what I try I cant get it right.  When I add validators at runtime i have a different set of issues.  Hope someone can help.

Avatar of Steve Hougom
Steve Hougom
Flag of United States of America image

ASKER

If i do this it errors out.

User generated image

User generated image
ASKER CERTIFIED SOLUTION
Avatar of Steve Hougom
Steve Hougom
Flag of United States of America image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial