angularjs - フォームをリセットする AngularJs .$setPristine

Question

フォームが送信されたら、フォームをリセットするのに苦労しています。誰かがこれをここに投稿しましたが、それを機能させたいのですが、成功しませんでした。これが私のコード例です。

$scope.form.$setPristine();trueに設定Pristine: {{user_form.$pristine}}されていません。上記の例を参照してください。

Answer 1

$setPristine() は、angularjs の 1.1.x ブランチで導入されました。動作させるには、1.0.7 ではなくそのバージョンを使用する必要があります。

http://plnkr.co/edit/815Bml?p=previewを参照

Answer 2

$invalid と $error の両方がエラーメッセージを表示するために使用されたため、フォームを元の状態に戻すだけでなく、元の状態に戻す必要がある同様の問題がありました。setPristine() を使用するだけでは、エラー メッセージをクリアするには不十分でした。

setPristine() と setUntouched() を使用して解決しました。(Angular のドキュメントを参照してください: https://docs.angularjs.org/api/ng/type/ngModel.NgModelController )

したがって、私のコントローラーでは、次を使用しました。

$scope.form.setPristine(); 
$scope.form.setUntouched();

これら 2 つの関数は、完全なフォームを $pristine にリセットし、$untouched に戻すことで、すべてのエラー メッセージをクリアしました。

Answer 3

フォームをコントローラーに送信するという別の方法があります。例えば：-

ビューで：-

<form name="myForm" ng-submit="addUser(myForm)" novalidate>
    <input type="text" ng-mode="user.name"/>
     <span style="color:red" ng-show="myForm.name.$dirty && myForm.name.$invalid">
      <span ng-show="myForm.name.$error.required">Name is required.</span>
    </span>

    <button ng-disabled="myForm.$invalid">Add User</button>
</form>

コントローラーで:-

$scope.addUser = function(myForm) {
       myForm.$setPristine();
};