returning null in Angular 2 custom validator throwing an error

问题

     <div class="col-md-6">
                <div class="form-group">
                    <h6>Email Address</h6>
                    <input type="text" class="form-control"  name="email"   formControlName='Bemail' required>
                    <div [hidden]="BusinessInfoForm.controls.Bemail.valid || (BusinessInfoForm.controls.Bemail.pristine && !submitted)" >
                                <p class="text-danger" [hidden]="!BusinessInfoForm.controls.Bemail.errors.required">mailAddressis required.</p>
                                <p  class="text-danger" [hidden]="!BusinessInfoForm.controls.Bemail.errors.incorrectMailFormat">Email format is invalid.</p>
                            </div>
                </div>
            </div>

Component code:


    this.BusinessInfoForm=this.BI.group({
              'BusinessName':['', Validators.required ],
              "Bphone":['', Validators.required ],
              "CBphone":['', Validators.required ],
              "Bemail": ['',Validators.compose([Validators.required, GlobalValidator.mailFormat])],
              "CBemail":['', Validators.required ],
              "BzipCode": ['', Validators.required ],
              "Bcity": ['', Validators.required ],
              "Bstate": ['', Validators.required ],
              "Bstreet1": ['', Validators.required ],
              "Bstreet2": ['', Validators.required ],
              'FirstName':['', Validators.required ],
              "LastName":['', Validators.required ],
              "zipcode": ['', Validators.required ],
              "city": ['', Validators.required ],
              "state": ['', Validators.required ],
              "checkboxvalue":['',Validators.required],
              "streetAddress1": ['', Validators.required ],
              "streetAddress2": ['', Validators.required ],
          },{validator:matchingValidator('Bemail','CBemail')})
          }
Global Validator Class:

    import { NG_VALIDATORS, AbstractControl, ValidatorFn, Validator,FormControl  } from '@angular/forms';
    export class GlobalValidator{

        static mailFormat(control: FormControl): ValidationResult {
            console.log(control.value);
            var EMAIL_REGEXP = /^(([^<>()\[\]\\.,;:\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,}))$/;

            if (control.value != "" && (control.value.length <= 5 || !EMAIL_REGEXP.test(control.value))) {
                return { "incorrectMailFormat": true };
            }    
           return  null;           
        }    
    }
interface ValidationResult {
    [key: string]: boolean;
}

Am I doing anything wrong here . As soon as email is validated its throwing an error saying that cannot read property required of null. When I return false instead of null the email is still in invalid state. So, the form is getting validated. Thanks.

来源：https://stackoverflow.com/questions/44199523/returning-null-in-angular-2-custom-validator-throwing-an-error