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：使用＆＃39; this＆＃39;在自定义验证器中

2 个答案: