jquery - tag - document queryselector angular element

¿Cómo puedo escuchar los eventos de jQuery en AngularJS?

Question

Estoy reescribiendo una aplicación jQuery para usar AngularJS. Estoy usando pequeños pasos y estoy reemplazando un área a la vez. Sin embargo, tengo problemas sobre cómo puedo escuchar los eventos de jQuery en AngularJS.

Como ejemplo, tengo $(document).trigger(''doSomething'') en un widget jQuery. ¿Cómo puedo escucharlo en un controlador AngularJS?

He intentado usar $scope.$on(''doSomething'', function(){}) , pero eso solo se refiere al alcance del controlador. También probé con $rootScope.$on(''doSomething'', function(){}) , pero sin suerte.

¿Hay alguna forma en la que paso a paso pueda convertir mi aplicación, y solo escuchar los eventos documentales activados por jQuery?

Answer 1

Estoy disparando desde la cadera aquí, pero creo que los eventos de jQuery y los eventos de AngularJS son dos sistemas separados. Una solución rápida podría ser contar con un oyente jQuery de eventos global que traduzca el evento jQuery a un evento AngularJS.

Más tarde, es posible que desee dos ajustar el widget en una directiva y poner un traductor de eventos más específico dentro de él. En ese punto, también podría considerar si desea adherirse al sistema de eventos o si un servicio angular podría ser una forma más adecuada para que el widget se comunique con el resto del mundo.

Lo anterior supone que no puede o no desea reescribir el widget para usar mecanismos AngularJS. Si esa es una opción, solo use $scope.$broadcast o $scope.$emit directamente en el widget en lugar de $.trigger .

Answer 2

Estoy adivinando aquí, pero podrías disparar un evento angular desde el evento jQuery y capturar este otro evento en Angular, así:

$( "p" ).on( "click", function() {
    // I''m not sure if you''d need to run code below inside $scope.$apply

    // $broadcast will send the event downwards the $scope hierarchy, while $emit will send it upwards
    $scope.$broadcast(''jquery-click'');
});

Y más adelante en algún lugar de tu código:

$scope.$on(''jquery-click'', function() {
    // desired code in Angular''s scope
});

Answer 3

Debería ver esta respuesta: https://.com/a/15012542/535025

No estoy seguro, pero creo que no puedes hacer eso. Como dijo @Supr, son dos sistemas separados con eventos personalizados separados.

Intenta no mezclar jQuery con Angular. Una buena recomendación es que cada vez que necesite llamar a $(''selector'').method() considere escribir una directiva, ya que se ocupa del enlace de datos.