¿Cuál es la diferencia entre ng-pristine y ng-dirty en AngularJS?

AngularJS admite la validación de formularios del lado del cliente. AngularJS realiza un seguimiento de todo el formulario y el campo de entrada y también almacena la información sobre si alguien ha tocado o modificado el campo o no.

Veamos las dos clases diferentes ng-dirty y ng-pristine que se usan para la validación de formularios

  • ng-pristine: la clase ng-pristine indica que el formulario no ha sido modificado por el usuario. Esto devuelve verdadero si el formulario no ha sido modificado por el usuario.
    Tipo de retorno:
    Devuelve Boolean True si el usuario no modifica el formulario/campo de entrada; de lo contrario, devuelve False.
  • ng-dirty: la clase ng-dirty indica que el usuario ha ensuciado (modificado) el formulario. Devuelve verdadero si el usuario ha modificado el formulario.
    Tipo de devolución:
    devuelve Boolean True si el usuario modifica el formulario/campo de entrada; de lo contrario, devuelve False.

Diferencia entre ng-pristine y ng-dirty:
la principal diferencia entre ambos es que ng-dirty se usa para indicar que el usuario modifica el campo de entrada y ng-pristine se usa para decirnos que el campo no se ha tocado. por el usuario
Vamos a ver con la ayuda de un pequeño ejemplo para aclararlo todo.

<!DOCTYPE html>
<html>
  
<head>
    <title>
      Difference between ng-pristine and ng-dirty
  </title>
</head>
  
<body>
    <center>
        <h1 style="color:green">GeeksforGeeks</h1>
        <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">
                Now Pristine.
            </div>
            <div class="error" 
                 ng-show="myForm.email.$dirty">
                Now Dirty
            </div>
        </form>
    </center>
</body>
  
</html>

Salida:
Antes:

Después:

Publicación traducida automáticamente

Artículo escrito por cybercreed010 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *