AngularJS - Disparadores de Eventos.
Hola chavos, tengo mucho tiempo que no escribía nada, una disculpa por eso he estado algo ocupado. Pero ya sin mas preámbulo, ahora les quiero compartir algo acerca de AngularJS: Disparadores!.
//Que es un Disparador?
Antes de proceder con el tema en cuestión debemos entender que es un Disparador. Un Disparador propaga alrededor de todo el campo de aplicacion una variable, esperando que sea capturada y de acuerdo al contenido de la variable se ejecutara una determinada acción o evento. Entendamos esto con un ejemplo simple: Una fiesta! Tu estas organizando una fiesta a la que quieres que asista la chava/chavo que te gusta. Para esto Distribuyes las invitaciones en tu escuela, esperando a que la invitacion le llegue a esa persona y que esta asista.
//Y como funciona en Angular?
En Angular existen 2 tipos de Disparadores: $broadcast y $emit. Cada uno tiene su propósito definido, lo veremos mas adelante. y posee un solo tipo de Manejador o Handler: $on. El entorno en que se dispara una variable es el $scope y siempre los Eventos van a ser funciones: function().
La sintaxis del $broadcast y del $emit es la misma:
$scope.[$broadcast | $emit]("Contenido a propagar*",Argumentos opcionales**);
*El contenido a propagar siempre tiene que ser un String
**Estos pueden ser varios, ya sea un Array, Object, String, numero, etc.
La sintaxis del $on es similar a la del $broadcast o $emit:
$scope.$on("Contenido Propagado",function(Argumentos*){
//Acciones a Realizar
});
*Aquí es donde se colocaran los argumentos que fueron propagados, deben de seguir el mismo orden que cuando fueron propagados.
//Diferencias entre $broadcast y $emit
Ambos disparan un evento, la diferencia es que en distintas direcciones:
//Que es un Disparador?
Antes de proceder con el tema en cuestión debemos entender que es un Disparador. Un Disparador propaga alrededor de todo el campo de aplicacion una variable, esperando que sea capturada y de acuerdo al contenido de la variable se ejecutara una determinada acción o evento. Entendamos esto con un ejemplo simple: Una fiesta! Tu estas organizando una fiesta a la que quieres que asista la chava/chavo que te gusta. Para esto Distribuyes las invitaciones en tu escuela, esperando a que la invitacion le llegue a esa persona y que esta asista.
- Evento.- Que es lo que quieres que pase cuando el contenido o variable llegue a su manejador o Handler.
- Dispatch o Disparador.-Función o Manera en la que se dispara la variable o contenido.
- Entorno.- En que ambiente o contexto se esta propagando la variable disparada..
- Handler o Manejador .- Función o Manera que entenderá la variable o contenido disparado.
- Variable Disparada .-Contenido o Variable que se distribuye en el Entorno definido.
//Y como funciona en Angular?
En Angular existen 2 tipos de Disparadores: $broadcast y $emit. Cada uno tiene su propósito definido, lo veremos mas adelante. y posee un solo tipo de Manejador o Handler: $on. El entorno en que se dispara una variable es el $scope y siempre los Eventos van a ser funciones: function().
La sintaxis del $broadcast y del $emit es la misma:
$scope.[$broadcast | $emit]("Contenido a propagar*",Argumentos opcionales**);
*El contenido a propagar siempre tiene que ser un String
**Estos pueden ser varios, ya sea un Array, Object, String, numero, etc.
La sintaxis del $on es similar a la del $broadcast o $emit:
$scope.$on("Contenido Propagado",function(Argumentos*){
//Acciones a Realizar
});
*Aquí es donde se colocaran los argumentos que fueron propagados, deben de seguir el mismo orden que cuando fueron propagados.
//Diferencias entre $broadcast y $emit
Ambos disparan un evento, la diferencia es que en distintas direcciones:
- $broadcast .- Dispara el evento para su $scope actual y para todos los $scopes que tenga como hijos
- $emit .- Dispara el evento para su $scope y para todos los $scopes padres que tenga, incluyendo $rootScope
+12.39.04.png)
+12.39.41.png)
El URL de mi Plunker es: http://plnkr.co/edit/y7t5IZxvcOYvB1f4rZKD?p=preview por si no se pued eidentificar el URL
ReplyDeletegracias por la data
ReplyDelete