Eventos de AngularJS
AngularJS tiene su propia directiva de eventos HTML.
comando ng-hacer clic en
La Directiva NG-CLICH define el evento de clic AngularJS.
Instancia de 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> <bod> ng-Controller = "myctrl"> <botón ng-click = "Count = Count + 1"> ¡Haz clic en mí! </botton> <p> {{count}} </p> </div> <script> var app = angular.module ('myapp', []); app.controller ('myctrl', function ($ scope) {$ scope.count = 0;}); </script> </body> </html>Efecto de ejecución:
0
Ocultar elementos HTML
La Directiva de Hide Ng se usa para establecer si la parte de la aplicación es visible.
ng-hide = "true" establece que el elemento HTML es invisible.
ng-hide = "falso" establece que el elemento HTML sea visible.
Instancia de 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> <bod> ng-Controller = "Personctrl"> <Botton ng-click = "toggle ()"> ocultar/show </boton> <p ng-hide = "myvar"> nombre: <input type = text ng-model = "fellowName"> <br> name: <input type = text ng-model = "lastName"> <Br> <BR> Nombre: {{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{ lastName}} </p> </div> <script> var app = angular.module ('myApp', []); app.controller ('personactrl', function ($ scope) {$ scope.firstname = "John"; $ scope.lastnne $ scope.myvar =! $ scope.myvar;Resultados de ejecución:
nombre:
apellido:
Nombre: John Doe
Análisis de la aplicación:
La primera parte del PersonController es similar al capítulo del controlador.
La aplicación tiene una propiedad predeterminada: $ scope.myvar = false;
La Directiva Ng Hide establece si el elemento <p> y los dos campos de entrada son visibles, y establece si es visible de acuerdo con el valor de myVar (verdadero o falso).
La función toggle () se usa para cambiar los valores de la variable myVAR (verdadero y falso).
ng-hide = "true" hace que el elemento sea invisible.
Mostrar elementos HTML
La Directiva NG-Show se puede usar para establecer si una parte de la aplicación es visible.
ng-show = "falso" puede establecer elementos HTML invisibles.
ng-show = "true" se puede configurar para ser visible para elementos HTML.
El siguiente ejemplo usa la Directiva NG-Show:
Instancia de 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> <bod> ng-controller="personCtrl"><button ng-click="toggle()">Hide/Show</button><p ng-show="myVar">Name: <input type=text ng-model="person.firstName"><br>Name: <input type=text ng-model="person.lastName"><br><br>Name: {{person.firstName + " " + Person.lastName}} </p> </div> <script> var app = angular.module ('myApp', []); app.controller ('personctrl', function ($ scope) {$ scope.person = {firstName:" John ", LastName:" doe "}; $ scope.myvar = true; $ scope; $ scope.myvar =! $ scope.myvar;Resultados de ejecución:
nombre:
apellido:
Nombre: John Doe
Lo anterior es una compilación de la información del evento AngularJS. Continuaremos agregándolo más tarde. Como referencia de amigos necesitados.