1. ホーム
  2. jquery-plugins

[解決済み】AngularJSでjQueryプラグインを統合する正しい方法

2022-04-09 07:41:32

質問

jQueryプラグインをangularアプリに統合する正しい方法は何だろうと考えていました。いくつかのチュートリアルやスクリーンキャストを見つけましたが、それらは特定のプラグインに特化したもののようです。

例えば http://amitgharat.wordpress.com/2013/02/03/an-approach-to-use-jquery-plugins-with-angularjs/ http://www.youtube.com/watch?v=8ozyXwLzFYs

このようなディレクティブを作成する必要があります - 。

App.directive('directiveName', function() {
    return {
        restrict: 'A',
        link: function(scope, element, attrs) {
            $(element).'pluginActivationFunction'(scope.$eval(attrs.directiveName));
        }
    };
}); 

そして、htmlの中でスクリプトとディレクティブを呼び出す?

<div directiveName ></div>
<script type="text/javascript" src="pluginName.js"></script>

ありがとうございました

解決方法は?

はい、その通りです。jQueryプラグインを使用する場合は、コントローラ内にコードを記述しないでください。代わりにディレクティブを作成し、通常のコードを link 関数を使用します。

ドキュメントにいくつかポイントがあるので、参考にしてみてください。ここに記載されています。

よくある落とし穴

コントローラを正しく使う

ビューでスクリプトを参照するときは、angularjs ライブラリ、コントローラ、サービス、およびフィルタを参照した後で、最後に参照するようにしてください。

編集: $(element) を使用することができます。 angular.element(element) AngularJSをjQueryで使用する場合