Angularjs html dom
AngularJS fournit des instructions pour lier les données d'application pour les propriétés des éléments HTML DOM.
Commande ng-hisaged
La directive Ng-Hisabled lie directement les données d'application à l'attribut désactivé de HTML.
Instance angularjs
<! Doctype html> <html> <ead> <meta charset = "utf-8"> <script src = "http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"> </script> </ head> <body> <div ng-App = "" ng-init = "Myswitch = <P> <Div ng-App =" "ng-init =" MySwitch = <P> <Div Ng-App = "" ng-init = "MySwitch = <P> <P> ng-disabled = "MySwitch"> Cliquez sur moi! </ bouton> </p> <p> <entrée type = "Checkbox" ng-model = "MySwitch" /> Button </p> <p> {{MySwitch}} </p> </div> </ body> </html>Effet de course:
Bouton
vrai
Exemple d'explication:
La directive Ng-Hisabled lie les données d'application "MySwitch" à la propriété désactivée de HTML.
La directive NG-Model lie "MySwitch" au contenu (valeur) de l'élément HTML Entrée à cocher.
Si MySwitch est vrai, le bouton ne sera pas disponible:
<p> <bouton désactivé> Cliquez sur moi! </futton> </p>
Si MySwitch est faux, le bouton est disponible:
<p> <fontificateur> Cliquez sur moi! </fontificateur> </p>
commande ng-spectacle
La directive Ng-Sows cache ou affiche un élément HTML.
Instance angularjs
<! Doctype html> <html> <éadf> <meta charset = "utf-8"> <script src = "http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"> </script> </head> <body> <div ng-App = ""> <p ng-shiw = "> i Amons. </p> <p ng-show = "false"> Je suis invisible. </p> </div> </ body> </html>
Effet de course:
Je suis visible.
La directive NG-show affiche (cache) des éléments HTML basés sur la valeur de la valeur.
Vous pouvez utiliser des expressions pour calculer les valeurs booléennes (vrai ou false):
Instance angularjs
<! Doctype html> <html> <éadf> <meta charset = "utf-8"> <script src = "http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"> </ script> </head> <body> <div ng-app = "" ng-init = "hour"> <p. ng-show = "hour> 12"> Je suis visible. </p> </div> </ body> </html>
Résultats en cours:
Je suis visible.
Remarque Dans le chapitre suivant, nous vous fournirons plus d'exemples de cachette des éléments HTML en cliquant sur les boutons.
commande ng-hide
La directive NG-Hide est utilisée pour masquer ou afficher les éléments HTML.
Instance angularjs
<!DOCTYPE html><html><head><meta charset="utf-8"><script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script></head><body><div ng-app=""><p ng-hide="true">I am invisible. </p> <p ng-hide = "false"> Je suis visible. </p> </div> </ body> </html>
Résultats en cours:
Je suis visible.
Ce qui précède est une compilation de matériaux HTML DOM AngularJS. Nous continuerons de les ajouter plus tard. J'espère que des amis qui pourront aider à programmer AngularJS.