将自定义验证器拆分为多个函数 Angular 2

Question

    export class FormFieldErrorExample {
      email = new FormControl('', [Validators.required, Validators.email, this.lengthValidator]);

      getErrorMessage() {
        return this.email.hasError('required') ? 'You must enter a value' :
            this.email.hasError('email') ? 'Not a valid email' :
                'minimum length should be greater than 10';
      }
      lengthValidator(control : AbstractControl){

        if(control.value.length <10)    
        return {lengthError : true};
        else return this.anotherValidator(control);
      }
anotherValidator(control: AbstractControl){

 return {lengthError : true};
}

我试图将验证器拆分为另一个函数，但出现了类似 'Cannot read property 'anotherValidator' of undefined' 的错误。我如何将验证器拆分为多个函数并正确传递 control

https://stackblitz.com/edit/angular-psfasq-5yxaln

Answer 1

您应该使用 bind()

将 this 的上下文传递给您的自定义验证器 lengthValidator

email = new FormControl('', [Validators.required, Validators.email, this.lengthValidator.bind(this)])

将自定义验证器拆分为多个函数 Angular 2

Split Custom Validator into multiple Functions Angular 2

angular2-forms

angular-validation

angular

angular-reactive-forms