AngularJSで、ng-pristineとng-dirtyの違いは何ですか？

違いは何ですかng-pristineとはng-dirty？あなたは両方を持つことができるようですtrue：

$scope.myForm.$pristine = true; // after editing the form

ng-dirtyクラスは、一方の形式は、ユーザーによって変更されていることを示していますng-pristineクラスは、フォームがユーザーによって変更されていないことを示しています。だから、ng-dirtyとng-pristine同じ話の双方があります。

クラスは任意のフィールドに設定されますが、フォームには2つのプロパティとが$dirtyあり$pristineます。

$scope.form.$setPristine()関数を使用してフォームを初期状態にリセットできます（これはAngularJS 1.1.xの機能であることに注意してください）。

あなたがしたい場合$scope.form.$setPristine()でも、AngularJSの1.0.xのブランチに-ish行動を、あなた自身のソリューションを（いくつかのかなり良いものを見つけることができるロールバックする必要があるここ）。基本的に、これはすべてのフォームフィールドを繰り返し処理し、$dirtyフラグをに設定することを意味しfalseます。

お役に立てれば。

pristineはフィールドがまだ未使用であるかどうかを通知し、dirtyはユーザーが関連フィールドにすでに何かを入力したかどうかを通知します。

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.min.js"></script>
<form ng-app="" name="myForm">
  <input name="email" ng-model="data.email">
  <div class="info" ng-show="myForm.email.$pristine">
    Email is virgine.
  </div>
  <div class="error" ng-show="myForm.email.$dirty">
    E-mail is dirty
  </div>
</form>

単一のkeydownイベントを登録したフィールドは、未使用ではなく（元の状態ではなくなり）、したがって、いつまでもダーティです。

どちらのディレクティブも明らかに同じ目的を果たします。両方を含めるという角度のチームの決定は、DRYの原則に干渉し、ページのペイロードに追加するように見えますが、両方を配置することはまだ実用的です。CSSファイルでのスタイル設定に.ng-pristineと.ng-dirtyの両方を使用できるため、入力要素のスタイル設定が簡単になります。これが両方のディレクティブを追加する主な理由だったと思います。

以前の回答ですでに述べたようにng-pristine、フィールドが変更されていないことを示すためですが、フィールドが変更ng-dirtyされたことを伝えるためです。なぜ両方が必要なのですか？

フィールドに電話番号と電子メールアドレスが入ったフォームがあるとします。電話または電子メールのいずれかが必要です。また、各フィールドに無効なデータがある場合はユーザーに通知する必要があります。これはng-dirty、とをng-pristine組み合わせて使用することで実現できます。

<form name="myForm">
    <input name="email" ng-model="data.email" ng-required="!data.phone">
    <div class="error" 
         ng-show="myForm.email.$invalid && 
                  myForm.email.$pristine &&
                  myForm.phone.$pristine">Phone or e-mail required</div>
    <div class="error" 
         ng-show="myForm.email.$invalid && myForm.email.$dirty">
        E-mail is invalid
    </div>

    <input name="phone" ng-model="data.phone" ng-required="!data.email">
    <div class="error" 
         ng-show="myForm.phone.$invalid && 
                  myForm.email.$pristine &&
                  myForm.phone.$pristine">Phone or e-mail required</div>
    <div class="error" 
         ng-show="myForm.phone.$invalid && myForm.phone.$dirty">
        Phone is invalid
    </div>
</form>

ng-pristine （$ pristine）

フォーム/入力がまだ使用されていない（ユーザーが変更していない）場合はブール値True）

ng-dirty （$ dirty）

フォーム/入力が使用された場合はブール値True（ユーザーが変更）

$ setDirty（）; フォームをダーティ状態に設定します。このメソッドを呼び出して、「ng-dirty」クラスを追加し、フォームをダーティな状態（ng-dirtyクラス）に設定できます。このメソッドは、現在の状態を親フォームに伝達します。

$ setPristine（）; フォームを元の状態に設定します。このメソッドはフォームの$ pristine状態をtrueに、$ dirty状態をfalseに設定し、ng-dirtyクラスを削除してng-pristineクラスを追加します。さらに、$ submitted状態をfalseに設定します。このメソッドは、このフォームに含まれるすべてのコントロールにも伝達されます。

フォームを元の状態に戻すことは、フォームを保存またはリセットした後でフォームを「再利用」する場合に役立ちます。