AngularJSのjQueryイベントを聞くにはどうすればいいですか？

Question

AngularJSを使用するようにjQueryアプリケーションを書き直しています。私は小さなステップを使用して、一度に1つの領域を置き換えています。しかし、私はAngularJSでjQueryのイベントをどのように聞くことができるかに関する問題を抱えています。

例として、私は$(document).trigger('doSomething')をjQueryウィジェットに持っています。どのようにAngularJSコントローラで聞くことができますか？

私は$scope.$on('doSomething', function(){})を使用しようとしましたが、これはコントローラのスコープのみを参照しています。私も$rootScope.$on('doSomething', function(){})で試しましたが、運がありません。

ステップバイステップで私のアプリケーションを変換し、jQueryによってトリガされたドキュメントイベントを聞く方法はありますか？

Answer 1

私はヒップから発砲していますが、jQueryイベントとAngularJSイベントは2つの別々のシステムだと思います。 jQueryイベントをAngularJSイベントに変換する、グローバルキャッチオールjQueryイベントリスナーを使用するのが簡単な解決策です。

後でウィジェットをディレクティブにラップして、より具体的なイベントトランスレータをその中に入れたいと思うかもしれません。その時点で、イベントシステムに固執したいのか、ウィジェットが他の世界と通信するのに適しているのかを検討することもできます。

上記は、AngularJSメカニズムを使用するためにウィジェットを書き換えることができない、またはしたくないと想定しています。それがオプションの場合は、ではなく、$scope.$broadcastまたは$scope.$emitを直接ウィジェットで使用してください。

Answer 2

あなたはこの答えが表示されるはずです。https://stackoverflow.com/a/15012542/535025

私はわからないが、私はあなたがそれを行うことはできないと思います。 @Suprのように、それらは分離されたカスタムイベントを持つ2つの別々のシステムです。

jQueryとAngularを混在させないようにしてください。良い奨励は、あなたが$('selector').method()に電話する必要があるたびに、データバインディングを担当するため、指令を書くことを検討することです。

Answer 3

私はここで推測しているが、あなたはjQueryのイベント内からの角度イベントを発生し、角度で、この他のイベントをキャプチャすることができ、このように：あなたのコード内のどこかに

$("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'); 
}); 

以降：

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