1

私は最新の angular2 フォームで作業しており、この一見単純な作業に苦労しています。現在のコンポーネントのプロパティを読み取り、それに基づいて入力を検証できるカスタム検証関数が必要です。plnkr の例を次に示します。

http://plnkr.co/edit/bNFjNsCfhYjoqKaRZgQU?p=preview

この例では、常に必要なユーザー名フィールドと、顧客が既存の顧客である場合にのみ必要となるパスワード フィールドがあります。

私のフォーム宣言は次のとおりです。

this.loginForm = this.formBuilder.group({
  username: ["", Validators.required],
  password: ["", this.passwordRequiredForExistingCustomer]
});

私の検証機能は次のとおりです。

passwordRequiredForExistingCustomer(control: FormControl): {[key: string]: boolean} {
  let val = control.value;
  if (this.state === "existingCustomer" && !val) {
    return {"required": true};
  }

  return null;
}

ただし、検証関数内で現在のコンポーネントを参照できません。[既存の顧客] ボタンをクリックすると、コンソールにエラーが表示されます。これは、カスタム関数がトリガーされ、見つからない場合thisです。

何か不足していますか？このタスクを達成するには、どのアプローチを取る必要がありますか?

ありがとう、

ハリー

4

1 に答える 1

0

passwordRequiredForExistingCustomer現在のコンポーネントのメソッドである場合、バリデーターをアロー関数として渡し、スコープを維持しますthis.

this.loginForm = this.formBuilder.group({
  username: ["", Validators.required],
  password: ["", (control) => this.passwordRequiredForExistingCustomer(control)]
});
于 2016-07-21T06:46:09.683 に答える