AngularJS directive ng-modèle
ng-modèle instruction est utilisé pour lier les données d'application au contrôleur de valeur HTML (entrée, sélectionnez, textarea) de.
directive ng-modèle
ng-model
directive peut entrer des valeurs variables et AngularJS domaine créé reliures.
AngularJS exemples
Nom: <input ng-model = " name">
</ Div>
<Script>
var app = angular.module ( 'myApp', []);
app.controller ( 'myCtrl', function ($ portée) {
$ Scope.name = "John Doe";
});
</ Script>
Essayez »
Way liaison
liaison bidirectionnelle, lorsque vous modifiez la valeur du champ de saisie, la valeur de la propriété sera également critique AngularJS:
AngularJS exemples
Nom: <input ng-model = " name">
<H1> vous entrez: {{name}} </ h1>
</ Div>
Essayez »
Valider l'entrée utilisateur
AngularJS exemples
Email:
<Input type = "email" name = "MyAddress" ng-model = "text">
<Span ng-show = "myForm.myAddress . $ Error.email"> est pas une adresse e - mail valide </ span>
</ Form>
Essayez »
L'exemple ci - dessus, le message dans le ng-show
propriété renvoie true
cas d'affichage.
Etat d'application
ng-model
directive apporte de la valeur d'état (invalide, sale, touché, erreur ) pour les données d'application:
AngularJS exemples
Email:
<Input type = "email" name = ng-modèle "MyAddress" = "myText" nécessaire> </ p>
<H1> Statut </ h1>
{{MyForm.myAddress. $ Valide}}
{{MyForm.myAddress. $ Sale}}
{{MyForm.myAddress. $ Touché}}
</ Form>
Essayez »
classe CSS
ng-model
instruction sur la base de leurs états fournissent des classes CSS pour les éléments HTML:
AngularJS exemples
background-color: lightblue;
}
<Body>
<Form ng-app = "" name = "myForm">
Entrez votre nom:
<Input name = "MyAddress" ng -modèle = "text" requis>
</ Form>
Essayez »
ng-model
instruction sur la base du champ de formulaire d'état pour ajouter / supprimer les catégories suivantes:
- ng-vide
- ng-not-vide
- ng-touché
- ng-épargnée
- ng valide
- ng-invalide
- ng-sale
- ng pendante
- ng-vierge