Ejemplo
"Estado válido" de esta forma no se considera "verdadera", siempre y cuando el campo de entrada deseado está vacía:
<form name="myForm">
<input name="myInput" ng-model="myInput" required>
</form>
<p>The forms's valid state is:</p>
<h1>{{myForm.$valid}}</h1>
Inténtalo tú mismo " Definición y Uso
AngularJS modifica el comportamiento predeterminado de la <form> elemento.
Se forma dentro de una aplicación AngularJS se dan ciertas propiedades. Estas propiedades se describe el estado actual de la forma.
Formas tienen los siguientes estados:
-
$pristineNo hay campos han sido modificados sin embargo, -
$dirtyUno o más han sido modificados -
$invalidEl contenido del formulario no es válido -
$validEl contenido del formulario es válido -
$submittedel formulario es enviado
El valor de cada estado representa un valor booleano, y de que sea true o false .
Formas en AngularJS impide la acción por defecto, que el formulario sea enviado al servidor, si no se especifica el atributo de acción.
Sintaxis
<form name=" formname "></form>Formas se denominan utilizando el valor del atributo name.
Las clases CSS
Se forma dentro de una aplicación AngularJS se dan ciertas clases. Estas clases se pueden utilizar para las formas de estilo en función de su estado.
Se añaden las siguientes clases:
-
ng-pristineNo hay campos no ha sido modificado aún -
ng-dirtyUno o más campos han sido modificados -
ng-validel contenido del formulario es válido -
ng-invalidEl contenido del formulario no es válida -
ng-valid- keyUna de las claves para cada validación. Ejemplo:ng-valid-required, útil cuando hay más de una cosa que debe ser validada -
ng-invalid- keyEjemplo:ng-invalid-required
Las clases se eliminan si el valor que representan es false .
Ejemplo
Aplicar estilos de formas sin modificar (vírgenes), y para las formas modificadas:
<style>
form.ng-pristine {
background-color: lightblue;
}
form.ng-dirty {
background-color: pink;
}
</style>
Inténtalo tú mismo "