AngularJS form directive

Definition and usage

AngularJS modification <form> The default behavior of the element.

Form elements within AngularJS applications are assigned certain properties. These properties describe the current state of the form.

The form has the following states:

• $pristine No fields have been modified
• $dirty Prawdopodobnie zostały zmodyfikowane jeden lub więcej pól
• $invalid Zawartość formularza jest nieważna
• $valid Zawartość formularza jest ważna
• $subscribed Form has been submitted

Each state's value represents a boolean value, for true or false.

If the action attribute is not specified, AngularJS form will prevent the default action, i.e., submitting the form to the server.

Instance

Example 1

As long as the required input field is empty, the 'valid state' of this form will not be considered as "true":

<form name="myForm">
<input name="myInput" ng-model="myInput" required>
</form>
<p>The form's valid state is:</p>
<h1>{{myForm.$valid}}</h1>

Spróbuj sam

Example 2

Apply styles to the unmodified (original) form and the modified form:

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

Spróbuj sam

Gramatyka

<form name="formname</form>

przez użycie name wartości atrybutu do odniesienia do formularza.

Klasy CSS

Formularze w aplikacji AngularJS są przypisane pewnym klasom. Te klasy mogą być używane do ustawiania stylów formularza na podstawie jego stanu.

Dodano następujące klasy:

• ng-pristine Brak pól do zmodyfikowania
• ng-dirty Prawdopodobnie zostały zmodyfikowane jeden lub więcej pól
• ng-valid Zawartość formularza jest ważna
• ng-invalid Zawartość formularza jest nieważna
• ng-valid-key walidacja jednego klucza na raz. Na przykład:ng-valid-requiredjest bardzo użyteczne, gdy musi być walidowane więcej niż jedno pole
• ng-invalid-key Na przykład:ng-invalid-required

Jeśli wartość reprezentowana przez klasę falseW przypadku usunięcia tych klas.