В AngularJS, в чем разница между ng-pristine и NG-dirty?

Question

В AngularJS, в чем разница между ng-pristine и NG-dirty?

В чем разница между ng-pristine и ng-dirty? Кажется, вы можете иметь оба, чтобы быть true:

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

547 5

angularjs

5 ответов:

Comments

Ничего не найдено.

Golo Roden · Accepted Answer · 2017-05-23 15:34:45

The ng-dirty класс говорит вам, что форма была изменена Пользователем, в то время как ng-pristine класс говорит вам, что форма не была изменена пользователем. Так что ng-dirty и ng-pristine две стороны одной и той же истории.

классы организованы на любом поле, в то время как форма имеет два свойства, $dirty и $pristine.

можно использовать $scope.form.$setPristine() функция для сброса формы в первозданное состояние (обратите внимание, что это AngularJS 1.1.икс особенность.)

если вы хотите $scope.form.$setPristine()-иш поведение даже в 1.0.X ветвь AngularJS, вам нужно свернуть свое собственное решение (некоторые довольно хорошие можно найти здесь). В принципе, это означает повторение всех полей формы и установку их $dirty флаг false.

надеюсь, что это помогает.

Meziane · Accepted Answer · 2017-03-18 02:31:12

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, больше не является девственным (нетронутым) и поэтому грязным навсегда.

zszep · Accepted Answer · 2013-11-10 22:07:23

обе директивы, очевидно, служат одной и той же цели, и хотя кажется, что решение угловой команды включить оба мешают сухому принципу и добавляют к полезной нагрузке страницы, все же довольно практично иметь их обоих вокруг. Легче стилизовать входные элементы, поскольку у вас есть как .ng-pristine, так и .ng-dirty, доступные для стилизации в ваших файлах css. Я думаю, что это было основной причиной для добавления обеих директив.

sandst1 · Accepted Answer · 2014-03-07 10:55:21

как уже говорилось в предыдущих ответах, 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>

Dhyan Mohandas · Accepted Answer · 2017-09-25 13:31:47

ng-pristine($pristine)

логическое значение True, если форма / вход еще не используется (не изменено)

ng-dirty($dirty)

логическое значение True, если была использована форма/вход ( изменено пользователем)

$setDirty(); Устанавливает форму в грязное состояние. Этот метод можно вызвать для добавления класса' ng-dirty ' и установить форма в грязное состояние (ng-грязный класс). Этот метод будет распространять текущее состояние на родительские формы.

$setPristine(); Устанавливает форму в ее первозданное состояние. Этот метод устанавливает $pristine состояние формы true, $dirty состояние false, удаляет ng-dirty класс и добавляет ng-pristine класс. Кроме того, он устанавливает состояние $submitted в false. Этот метод также распространяется на все элементы управления, содержащиеся в этой форме.

настройки формы возврат к первозданному состоянию часто бывает полезен, когда мы хотим "повторно использовать" форму после ее сохранения или сброса.