2016-10-30 4 views
3

私はAngular2のFormBuilderを使ってカスタムバリデーションを使ってフォームを開発しています。 問題:customValidatorで、thisを使用してローカルオブジェクトdataにアクセスしています。検証が実行されると、undefinedエラーが発生します。Angular2 FormBuilder:カスタムバリデーターで 'this'を使用する

のCustomValidatorは別のオブジェクトで実行し、そのためthis参照

質問に変化しているように見えます:はどのように私はのCustomValidatorへthisの参照を渡すことができますか?

機能はこれに拘束されていることを確認するために、矢印の機能を使用して
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] 
     }) 
    } 
} 

答えて

6

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

"this.data.foo"を関数 "customValidator"にパラメータとして送信することはできますか?もしそうなら、どうですか? – Vanquiza

+1

いいえ:Angularはバリデータ関数を呼び出し、1つの引数のみを渡します。しかし、関数を 'this'に束縛して、関数の内部から' this'にアクセスすることで、あなたはそれをやっています。クロージャーメカニズムを使用して、バリデータ関数を作成して返す関数にデータを渡すこともできます。しかし、矢印の機能は簡単です。 –

3

受け入れ答えはAbstractControlへの鋳造(起因する問題を入力する角度2.0に私のために動作しませんでしたA FormControl、私は信じている)。以下は、しかし、非常にうまく問題を解決:

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

.bind(this)を使用してバリデータを参照するには、私のためにトリックをしました。

関連する問題