Correct way to integrate jQuery plugins in AngularJS

Question

I was wondering what is the correct way to integrate jQuery plugins into my angular app  I ve found several tutorials and screen-casts but they seem catered to a specific plugin   For Example  http   amitgharat wordpress com 2013 02 03 an-approach-to-use-jquery-plugins-with-angularjs  http   www youtube com watch v 8ozyXwLzFYs  Should I create a directive like so -   App directive  directiveName   function         return           restrict   A           link  function scope  element  attrs                  element   pluginActivationFunction  scope  eval attrs directiveName                            And then in the html call the script and the directive    lt div directiveName  gt  lt  div gt   lt script type  text javascript  src  pluginName js  gt  lt  script gt    Thanks ahead

User · Accepted Answer

Yes  you are correct  If you are using a jQuery plugin  do not put the code in the controller  Instead create a directive and put the code that you would normally have inside the link function of the directive     There are a couple of points in the documentation that you could take a look at  You can find them here  Common Pitfalls    Using controllers correctly  Ensure that when you are referencing the script in your view  you refer it last - after the angularjs library  controllers  services and filters are referenced   EDIT  Rather than using   element   you can make use of angular element element  when using AngularJS with jQuery

User · Answer

i have alreay 2 situations where directives and services factories didnt play well   the scenario is that i have  had  a directive that has dependency injection of a service  and from the directive i ask the service to make an ajax call  with  http    in the end  in both cases the ng-Repeat did not file at all  even when i gave the array an initial value   i even tried to make a directive with a controller and an isolated-scope  only when i moved everything to a controller and it worked like magic   example about this here Initialising jQuery plugin  RoyalSlider  in Angular JS

[jquery-plugins] Correct way to integrate jQuery plugins in AngularJS

Examples related to jquery-plugins

Examples related to angularjs