2角度 - 私はこの方法（フォームがFormGroupを使用して構築されている）を使用して、特定のオプションが選択された場合は、入力の検証ルールを更新する機能を書いた検証エラー

Question

を削除する：

onValueChanged(data : any) { 
    let appVIP1 = this.vip1TabForm.get('option1'); 
    let appVIP2 = this.vip2TabForm.get('option2'); 
    let appVIP3 = this.vip3TabForm.get('option3'); 

    //Set required validation if data is 'option3' 
    if(data != 'option3') { 
     //Due to initialization errors in UI, need to start with the case 
     //That there are validations, check to remove them 
     appVIP1.setValidators([]); 
     appVIP2.setValidators([]); 
     appVIP3.setValidators([]); 
    } 
    else { 
     appVIP1.setValidators([Validators.required]); 
     appVIP2.setValidators([Validators.required]); 
     appVIP3.setValidators([Validators.required]); 
    } 
}  

を私はバインドラジオボタン（私は最初にthis answerからのガイドを使用しましたが、onChange関数が正しくバインドされていませんでした）でクリックイベントを呼び出します。

これはうまくいきます。ユーザーがオプション1または2を選択すると、検証は空で、トリガーされません。オプション3を選択すると、検証が表示され、送信が停止されます。しかし、私はユーザーが提出し、エラーを見て、オプション1または2に変更する問題にぶつかります。バリデータがクリアされている間も、私のフォームは無効として読み込まれます。私は検証している複数の入力フィールドを持っているので、バリデータがこのように削除された場合、フォームを有効にするだけでは設定できません。これをどうやってやりますか？フォームグループの特定のフィールドのhas-errorを削除できますか？

Answer 1

正しいバリデータが所定の位置にある場合、それらはオプションを選択した後、あなたがmanually call AbstractControl#updateValueAndValidityことができます。

this.formBuilder.updateValueAndValidity(); 

（。もちろん、this.formBuilderがあなたのFormBuilderインスタンスである場合は、）

をあなたはまた、それを呼び出すことができますFormElements上で直接実行できます。

これは、フォーム要素の値がプログラムによって変更された後で検証をトリガするためによく使用されます。