113

ng-pristineとはどう違いng-dirtyますか?あなたは両方になることができるようですtrue

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

5 に答える 5

217

ng-dirtyクラスは、フォームがユーザーによって変更されたことを通知しますが、クラスng-pristineはフォームがユーザーによって変更されていないことを通知します。だからng-dirtyng-pristine同じ話の両面です。

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

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

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

お役に立てれば。

于 2013-08-06T06:44:42.110 に答える
34

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

于 2013-11-10T20:07:23.037 に答える
10

以前の回答で既に述べたように、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>
于 2014-03-07T08:55:21.067 に答える
1

ng-pristine ($pristine)

Boolean フォーム/入力がまだ使用されていない場合 (ユーザーによって変更されていない場合)は True

NG-ダーティー ($dirty)

Boolean フォーム/入力が使用された (ユーザーによって変更された)場合は True


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

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

フォームを元の状態に戻す設定は、フォームを保存またはリセットした後に「再利用」したい場合に便利です。

于 2017-09-25T10:18:36.457 に答える