Direttiva form AngularJS

Definizione e uso

Modifica AngularJS <form> Il comportamento predefinito degli elementi.

I moduli all'interno dell'applicazione AngularJS sono assegnati alcune proprietà. Queste proprietà descrivono lo stato attuale del modulo.

Il modulo ha i seguenti stati:

• $pristine Non è stato modificato alcun campo
• $dirty Un campo o più campi sono stati modificati
• $invalid Il contenuto del modulo è non valido
• $valid Il contenuto del modulo è valido
• $subscribed Il modulo è stato inviato

Ogni valore di stato rappresenta un valore booleano, per true o false.

Se non viene specificato l'attributo action, il modulo di AngularJS blocca l'azione predefinita, ossia l'inoltro del modulo al server.

Esempio

Esempio 1

Finché il campo di input richiesto è vuoto, lo stato di "validità" di questo modulo non sarà considerato "true":

<form name="myForm">
<input name="myInput" ng-model="myInput" required>
</form>
<p>Lo stato di validità del modulo è:</p>
<h1>{{myForm.$valid}}</h1>

Prova te stesso

Esempio 2

Applica lo stile ai moduli non modificati (originali) e ai moduli modificati:

<style>
form.ng-pristine {
    background-color: lightblue;
}
form.ng-dirty {
    background-color: pink;
}
</style>

Prova te stesso

Sintassi

<form name="formname</form>

attraverso l'uso di name per riferimento al modulo utilizzando il valore dell'attributo.

Classi CSS

I moduli all'interno dell'applicazione AngularJS sono assegnati a determinate classi. Queste classi possono essere utilizzate per impostare lo stile del modulo in base al suo stato.

Aggiunte le seguenti classi:

• ng-pristine Non ci sono campi non modificati
• ng-dirty Un campo o più campi sono stati modificati
• ng-valid Il contenuto del modulo è valido
• ng-invalid Il contenuto del modulo è non valido
• ng-valid-key Verifica una chiave alla volta. Ad esempio:ng-valid-requiredè molto utile quando ci sono più di una voce da verificare
• ng-invalid-key Ad esempio:ng-invalid-required

Se il valore rappresentato dalla classe è falseSe queste classi vengono eliminate.