AngularJS validazione dell'input
AngularJS form e controlli possono convalidare input di dati.
La convalida dell'input
Nelle sezioni precedenti, avete imparato la conoscenza AngularJS form e controlli.
AngularJS form e controlli in grado di offrire funzionalità di convalida ei dati illegali inseriti dall'utente un avvertimento.
 | Verificare che il client non è in grado di garantire la sicurezza di immissione dei dati utente, server convalida dei dati è anche necessario. |
|---|
Il codice dell'applicazione
<! DOCTYPE html>
<HTML>
<Script src = "http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"> </ script>
<Body>
<H2> convalida Esempio </ h2 >
<Form ng-app = "myApp " ng-controllore = "validateCtrl"
name = "myForm" novalidate>
<P> Nome utente: <br>
<Input type = "text" name = ng-modello "utente" = "user" richiesti>
<Span style = "color: red " ng-show = ".. MyForm.user $ sporco && myForm.user $ valido">
<Span ng-show = "myForm.user . $ Error.required"> username è necessario. </ Span>
</ Span>
</ P>
<P> E-mail: <br>
<Input type = nome "e-mail" = "email" ng-model = "email" necessaria>
<Span style = "color: red " ng-show = ".. MyForm.email $ sporco && myForm.email $ valido">
<Span ng-show = "myForm.email . $ Error.required"> casella di posta è un must. </ Span>
<span ng-show = "myForm.email . $ Error.email"> mailbox illegali. </ Span>
</ Span>
</ P>
<P>
<Input type = "submit"
ng-disabled = "myForm.user. $ sporco && myForm.user. $ valida ||
myForm.email. $ sporco && myForm.email. $ valido ">
</ P>
</ Form>
<Script>
var app = angular.module ( 'myApp', []);
app.controller ( 'validateCtrl', function ($ portata) {
$ Scope.user = 'John Doe';
$ Scope.email = '[email protected]';
});
</ Script>
</ Corpo>
</ Html>
<HTML>
<Script src = "http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"> </ script>
<Body>
<H2> convalida Esempio </ h2 >
<Form ng-app = "myApp " ng-controllore = "validateCtrl"
name = "myForm" novalidate>
<P> Nome utente: <br>
<Input type = "text" name = ng-modello "utente" = "user" richiesti>
<Span style = "color: red " ng-show = ".. MyForm.user $ sporco && myForm.user $ valido">
<Span ng-show = "myForm.user . $ Error.required"> username è necessario. </ Span>
</ Span>
</ P>
<P> E-mail: <br>
<Input type = nome "e-mail" = "email" ng-model = "email" necessaria>
<Span style = "color: red " ng-show = ".. MyForm.email $ sporco && myForm.email $ valido">
<Span ng-show = "myForm.email . $ Error.required"> casella di posta è un must. </ Span>
<span ng-show = "myForm.email . $ Error.email"> mailbox illegali. </ Span>
</ Span>
</ P>
<P>
<Input type = "submit"
ng-disabled = "myForm.user. $ sporco && myForm.user. $ valida ||
myForm.email. $ sporco && myForm.email. $ valido ">
</ P>
</ Form>
<Script>
var app = angular.module ( 'myApp', []);
app.controller ( 'validateCtrl', function ($ portata) {
$ Scope.user = 'John Doe';
$ Scope.email = '[email protected]';
});
</ Script>
</ Corpo>
</ Html>
Prova »
| modulo di attributi HTML novalidate per disabilitare la validazione di default del browser. |
|---|
Esempi di analitica
AngularJS istruzioni ng-modello è utilizzato per legare elementi di input per il modello.
oggetto modello ha due attributi: facilità d'uso ed e-mail.
Usiamo il comando ng-spettacolo, colore: rosso nel messaggio è di soli $ sporco o visualizzazione non valida $.
| proprietà | descrizione |
|---|---|
| $ sporco | Ci sono moduli da compilare registrare |
| $ valido | Il contenuto dei campi legittima |
| $ non valido | Il contenuto dei campi sono illegali |
| $ Pristine | Non ci sono moduli da compilare registrare |