2

他の人と同じように、メッセージが攻撃的になりすぎないように、Angular でフォームを検証する良い方法を探していました。私が得た最も近いものは、メッセージを送信する前に $dirty と $touched をチェックすることです。これはほとんどの状況で機能します。

私が把握できない 1 つの状況は、ユーザーが必須フィールドなどを編集するときです。フィールドにテキストがあり、有効で、ダーティで、タッチされています。ユーザーはフィールドに戻って変更します。入力が汚れていて、触れられていて、無効であるため、入力にあるものをバックスペースすると、すぐにメッセージが発生します。その時点で「リセット」し、ユーザーが入力を再びぼかしたときに再評価したいと思います。入力がまだ集中している間に入力する機会を与えます。

わかる？何か案は？

ありがとう！マット

4

3 に答える 3

1

おそらくこれはうまくいきます：

ng-model-options="{ updateOn: 'blur' }"

それを要素に追加しますinput。モデルが更新されると検証が行われると思います。このようにして、モデルはぼかしで更新されます。

ここで、このディレクティブのその他のオプションを確認できます: https://docs.angularjs.org/guide/formsのカスタム モデルの更新トリガー。ngModelOptionsのより詳細な説明。

それが機能するかどうか教えてください:)

于 2016-03-18T12:52:54.707 に答える
0

ngMessages のドキュメントをご覧ください: https://docs.angularjs.org/api/ngMessages/directive/ngMessages

使用方法を示す例があります。

<form name="myForm">
  <label>
    Enter your name:
    <input type="text"
           name="myName"
           ng-model="name"
           ng-minlength="5"
           ng-maxlength="20"
           required />
  </label>
  <pre>myForm.myName.$error = {{ myForm.myName.$error | json }}</pre>

  <div ng-messages="myForm.myName.$error" style="color:maroon" role="alert">
    <div ng-message="required">You did not enter a field</div>
    <div ng-message="minlength">Your field is too short</div>
    <div ng-message="maxlength">Your field is too long</div>
  </div>
</form>

これが最善の方法だと思います（少なくとも私はそうしています）。

于 2016-03-18T13:44:23.813 に答える
0

ng-blur の関数を使用して、無効な場合にメッセージを検証して表示します。

ng-blur="validate()"

あなたのコントローラで -

$scope.validate = function(){
   //Validate logic
     //If invalid
        //Show message logic here  
}
于 2016-03-18T12:55:11.083 に答える