[解決済み] Angular 2のFormGroupからすべての検証エラーを取得する
2022-08-07 12:57:17
質問
このコードが与えられたとき
this.form = this.formBuilder.group({
email: ['', [Validators.required, EmailValidator.isValid]],
hasAcceptedTerms: [false, Validators.pattern('true')]
});
のバリデーションエラーをすべて取得するにはどうしたらよいでしょうか?
this.form
?
ユニットテストを書いていて、アサートメッセージに実際の検証エラーを含めたいのですが、どうすればいいですか?
どのように解決するのですか?
私も同じ問題に遭遇し、すべてのバリデーションエラーを見つけ、表示するために、このメソッドを書きました。
getFormValidationErrors() {
Object.keys(this.productForm.controls).forEach(key => {
const controlErrors: ValidationErrors = this.productForm.get(key).errors;
if (controlErrors != null) {
Object.keys(controlErrors).forEach(keyError => {
console.log('Key control: ' + key + ', keyError: ' + keyError + ', err value: ', controlErrors[keyError]);
});
}
});
}
フォーム名
productForm
は、フォームのインスタンス名に変更します。
このように動作します。フォームからすべてのコントロールをフォーマット
{[p: string]: AbstractControl}
という形式でフォームからすべてのコントロールを取得し、各エラーキーで反復処理し、エラーの詳細を取得します。これは
null
エラーの値はスキップされます。
また、テンプレートビューでバリデーションエラーを表示するように変更することもできます。
console.log(..)
を必要なものに置き換えるだけです。
関連
-
[解決済み】アンギュラーコンポーネントにサービスを注入しようとするとエラー "EXCEPTION: Can't resolve all parameters for component"、なぜ?
-
[解決済み] Angular/RxJS `Subscription` からいつ退会すればいいのか?
-
[解決済み] Angular 2の "select "で新しい選択範囲を取得するにはどうすればよいですか?
-
[解決済み] Angularフォームフィールドを手動で無効に設定するにはどうすればよいですか?
-
[解決済み】Angular 2 Unit Tests。名前 'describe' が見つからない
-
[解決済み] ASP.NET MVCでModel State Errorsのコレクションを取得するにはどうすればよいですか?
-
[解決済み] ng buildの後にangular-cliのdist-folderのパスを変更するには?
-
[解決済み] Angular Materialでのデフォルトのソート - ヘッダーのソート
-
[解決済み] 文字列|ヌル'型の引数は、文字列'型のパラメータに代入できません。タイプ 'null' はタイプ 'string' に割り当てられません。
-
[解決済み] Angular2 bodyタグにクラスを追加する
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] Angular Materialでのデフォルトのソート - ヘッダーのソート
-
[解決済み] パイプ ' ' が見つかりません。
-
[解決済み] 角度2 ngfor 最初、最後、インデックスループ
-
[解決済み] angular-cliのパラメータ --base-href と --deploy-url の違いは何ですか?
-
[解決済み] Angular2でNgForがPipeでデータを更新しない。
-
[解決済み] Angularで、コントロールが作成された後、FormControlにバリデータを追加する方法は?
-
[解決済み] Angular / Angular Materialでmat-horizontal-stepperのステップをプログラムで移動させることは可能ですか?
-
[解決済み] Angular v5からAngular v6にプロジェクトをアップグレードしたい。
-
[解決済み] AngularでFormArrayからすべての項目を削除する
-
[解決済み] RxJSのmap演算子でエラーを出す方法 (angular)