ロード時の角度コンポーネントへのjQueryイベントの添付

Question

Angular JS 1.5を使用してWebサイトをコーディングし、新しいcomponentディレクティブを頻繁に使用しています。これまでのところ、それは素晴らしいです。私はコンポーネントシステムが大好きです。

しかし、私はjQuery 3.0とangularのコンポーネントを互いに話すことに少し問題があります。たとえば、このコードを取ってください。

(function($){ 
    $(document).ready(function() { 
     $('[animate-bounce]').velocity({ 
      translateY: '10px' 
     }, { 
      loop: true 
     }).velocity('reverse'); 
    }); 
})(jQuery); 

これは、通常のページ上で正常に動作しますが、理由はどのようにcomponent作品の性質上、それは$(document).ready後にインスタンス化されているコンポーネントには適用されません。それはもちろん意味があります。それらは存在しないので、それらに結びつくことはできません。

私はコンポーネントのライフサイクルについて知っています。具体的には、$onInitの機能です。私はそれにjQueryをフックできることを知っています。しかし、特定のjQueryコードをアクティブになるコンポーネントに適用したいと思っています。そのコードの有効化をcomponentコードから守りたいと思っていました。

これは可能ですか？コンポーネントがロードされたときにjQueryバインディングを実行させるcomponentの「グローバル」$onInitはありますか？または、新しいDOMが追加されたときにトリガーするjQueryの古いlive()バインディングが置き換えられていますか？

Answer 1

Cielでは、角度ライフサイクル全体でjQueryが干渉できない角度アプリでjQueryが試行されています。達成することは不可能ではありませんが、以下の理由により使用しないことをお勧めします。

• jQueryイベントとデータバインディングはAngularで処理されませんので、イベントとデータの削除については忘れてください。
• JQイベントを広範囲に処理すると、フレームワークとしてAngularを使用する目的がなくなります。

-workaround -

は、できるだけ多くの角度成分を使用してみてください、あなたは、リンクを使用して手を差し伸べると角度成分を作成中の関数をコンパイルすることがあります。

希望これを使用すると、DOM操作を持つように計画し、指示リンク関数内でそのjQueryのコードを入れた場合は、ディレクティブを使用する必要があります