Angular2 FormBuilder：在自定义验证器中使用 'this'

Question

我正在使用具有自定义验证功能的 Angular2 的 FormBuilder 开发一个表单。问题：在 customValidator 中，我使用 this 访问本地对象 data。执行验证时出现 undefined 错误。

看起来 customValidator 在不同的对象中执行，因此更改了 this 引用

问题： 如何将 this 的引用传递给 customValidator？

export class Ast {
    public data:any;
    public myForm:FormGroup;

    constructor(private _fb:FormBuilder) {
        this.data = {foo: "bar"};
    }

    customValidator(c: FormControl) {
        if (this.data.foo == "bar") { // This line crashes
            // DO something
        }
    }

   ngOnInit() {
       this.myForm = this._fb.group({
           some_field: ['', [<any>Validators.required], this.customValidator]
       })
   }
}

Answer 1

使用箭头函数，确保函数绑定到这个：

some_field: ['', [<any>Validators.required], c => this.customValidator(c)]

Answer 2

由于输入问题（我认为将 AbstractControl 转换为 FormControl，已接受的答案在 Angular 2.0 中对我不起作用。然而，以下内容很好地解决了这个问题：

ngOnInit() {
    this.myForm = this._fb.group({
        some_field: ['', [<any>Validators.required], this.customValidator.bind(this)]
    });
}

在对验证器的引用上使用 .bind(this) 对我有用。

Angular2 FormBuilder：在自定义验证器中使用 'this'

Angular2 FormBuilder: Using 'this' in a custom validator

formbuilder

angularjs

angular