AngularJs. $ SetPristine для сброса формы

Question

Я пытался сбросить форму после отправки формы. Кто-то опубликовал это Here, который я хочу, чтобы он работал, но не удался. Вот мой My Code Example.

$scope.form.$setPristine(); не устанавливает Pristine: {{user_form.$pristine}} по true. См. Пример выше.

Answer 1

$ setPristine() был введен в ветви 1.1.x угловойа. Для этого вам нужно использовать эту версию, а не 1.0.7.

См http://plnkr.co/edit/815Bml?p=preview

Answer 2

Только для тех, кто хочет получить $setPristine без необходимости обновления до v1.1.x, вот функция, которую я использовал для имитации функции $setPristine. Я не хотел использовать v1.1.5, потому что один из компонентов AngularUI, который я использовал, не совместим.

 var setPristine = function(form){ 
      if(form.$setPristine){//only supported from v1.1.x 
       form.$setPristine(); 
      }else{ 

       /* 
       *Underscore looping form properties, you can use for loop too like: 
       *for(var i in form){ 
       * var input = form[i]; ... 
       */ 
       _.each(form, function (input) 
       { 
        if (input.$dirty) { 
         input.$dirty = false; 
        } 
       }); 
      } 
     }; 

Обратите внимание, что это только делает $dirty поля чистыми и помочь изменения состояния «показать ошибки», как $scope.myForm.myField.$dirty && $scope.myForm.myField.$invalid.

Другие части объекта формы (например, классы css) по-прежнему необходимо учитывать, но это решает мою проблему: скрыть сообщения об ошибках.

Answer 3

я решил такую ​​же проблему того, чтобы сбросить форму в своем первозданном состоянии в угловых версии 1.0.7 (нет метода $ setPristine)

В моем случае использования, форма, после заполнения и представлен должен исчезнуть пока это снова не понадобится для заполнения другой записи. Поэтому я сделал эффект show/hide, используя ng-switch вместо ng-show. Как я и предполагал, с ng-переключателем, под-дерево DOM формы полностью удаляется и позже воссоздается. Таким образом, первоначальное состояние автоматически восстанавливается.

Мне это нравится, потому что оно простое и чистое, но оно не может быть пригодным для использования в чей-либо случае.

это может также подразумевать некоторые проблемы с производительностью для больших форм (?). В моей ситуации я еще не сталкивался с этой проблемой.

Answer 4

DavidLn's answer хорошо работал для меня в прошлом. Но он не захватывает все функциональные возможности setPristine, которые на этот раз споткнули меня. Вот более полная прокладка:

var form_set_pristine = function(form){ 
    // 2013-12-20 DF TODO: remove this function on Angular 1.1.x+ upgrade 
    // function is included natively 

    if(form.$setPristine){ 
     form.$setPristine(); 
    } else { 
     form.$pristine = true; 
     form.$dirty = false; 
     angular.forEach(form, function (input, key) { 
      if (input.$pristine) 
       input.$pristine = true; 
      if (input.$dirty) { 
       input.$dirty = false; 
      } 
     }); 
    } 
}; 

Answer 5

Существует еще один способ нетронутого формы, которая путем отправки формы в контроллер. Например: -

Ввиду: -

<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(); 
}; 

Answer 6

была аналогичная проблема, где я должен был установить форму обратно нетронутым, но также и нетронутыми, поскольку для отображения сообщений об ошибках использовались $ invalid и $ error. Использовать setPristine() было недостаточно, чтобы очистить сообщения об ошибках.

Я решил это с помощью setPristine() и setUntouched(). (смотрите документацию ANGULAR по: https://docs.angularjs.org/api/ng/type/ngModel.NgModelController)

Итак, в мой контроллер, я использовал:

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

Эти две функции сброса полной формы $ нетронутые и обратно до $ нетронутым, так что все сообщения об ошибках были очищено.