无法从 Angular OnInit 方法访问父对象？

Question

我正在尝试将自定义验证器附加到Angular Form Control。我正在 ngOnInit 方法中初始化表单控件。此验证器应检查字段是否已被赋予输入(与 Validators.required 非常相似(，但前提是布尔类成员this.shouldCheck为 true。

但是，当我尝试从验证器函数访问该类成员时，它找不到this的实例。我知道 Js 中的this存在一些臭名昭著的范围界定问题，但我认为这已经用 Typescript 解决了。不确定如何在验证器中检查该布尔值。

我的组件.ts：

// this shouldCheck's value is bound to a checkbox on the form
private shouldCheck: boolean = false;
constructor(private formBuilder: FormBuilder) {}
ngOnInit() {
this.employeeCreateForm = this.formBuilder.group({
firstName: [null, [
this.myRequiredValidator,
Validators.maxLength(30),
Validators.pattern('[^<|]+$')]],
lastName: [null, [
this.myRequiredValidator,
Validators.maxLength(40),
Validators.pattern('[^<|]+$')]]
}

我的自定义验证器：

myRequiredValidator(control: AbstractControl): ValidationErrors | null {
// if shouldCheck, perform a basic "required field" validation
if (this.shouldCheck) {
return !!control.value ? null : {required: true};
}
// else, don't apply validation error
return null;
}

无论我在哪里初始化shouldCheck，验证器函数都无法解析this，因此甚至无法实例化FormGroup。

我尝试使用简单的空检查：

if (this && this.shouldCheck) {
// do validation
}

。这允许构造FormGroup，但它似乎永远无法解析this，即使在表单初始化之后。我知道 ngOnInit 在类构造函数之后运行，所以无论如何这都不应该成为问题，但这就是我能想到的尝试。

谢谢。

Answer 1

nameRequiredValidator = (control: AbstractControl): ValidationErrors | null => {
// if shouldCheck, perform a basic "required field" validation
if (this.shouldCheck) {
return !!control.value ? null : {required: true};
}
// else, don't apply validation error
return null;
} 

或

ngOnInit() {
this.employeeCreateForm = this.formBuilder.group({
firstName: [null, [
this.myRequiredValidator(),
Validators.maxLength(30),
Validators.pattern('[^<|]+$')]],
lastName: [null, [
this.myRequiredValidator(),
Validators.maxLength(40),
Validators.pattern('[^<|]+$')]]
}
myRequiredValidator(): (AbstractControl) => ValidationErrors | null {
return (control: AbstractControl): ValidationErrors | null => {
// if shouldCheck, perform a basic "required field" validation
if (this.shouldCheck) {
return !!control.value ? null : {required: true};
}
// else, don't apply validation error
return null;
};
}