angularjsでフォーム検証を使用していますが、このGoogleグループスレッドと同じ問題を抱えています: https://groups.google.com/forum/#!msg/angular/W1Yya5TfIWo/7jZbfL-wROUJ、空フォームは、ユーザーが値を入力する前に「叫んでいます」。
これを解決するために、フィールドが$dirty
(ユーザーが触れた) 場合にのみエラー メッセージを表示します。ただし、ユーザーが何も触れずにフォームを直接送信すると、フォームは送信されませんが ( ではないため$valid
)、エラー メッセージも表示されません (フィールドが ではないため$dirty
)。
次に、以前にリンクされた Google グループのスレッドで、無効なフォーム送信のフィールドに「触れる」ことが提案されています。私は以下のようなものを使用してこれを行います:
$scope._updateUntouchedFields = function(form) {
for(var f in form) {
var field = form[f];
if (field.$addControl !== undefined) {
// $addControl exists, this is a nested form
// recursively update fields in that form
$scope._updateUntouchedFields(field);
} else if (field.$setViewValue !== undefined) {
// $setViewValue exists, this is a field, just
// set the view value to the current view value
if(field.$dirty) continue;
field.$setViewValue(field.$viewValue);
}
}
};
上記の関数は、送信時にフォームが無効な場合に呼び出されます。これには2つの問題があります:
- 現在のフォーム コントロールがネストされたフォームであるかどうかを判断する方法は、ハックのように思えます。より良い、より角度のある方法はありますか? 理想的には、他のフォームにネストされているかどうかに関係なく、すべてのフォーム コントロールのリストが必要です。
- これはどういうわけか自動的に行うことができますか?
<form>
フォーム ディレクティブをオーバーライドする方法や、この機能を配置できるタグにディレクティブを追加する方法はありますか? 今のところ、フォームがあるすべてのコントローラーにそれを配置し、送信機能にロジックを追加する必要があります。