Je me demandais quelle est la bonne façon d'intégrer les plugins jQuery dans mon application angulaire. J'ai trouvé plusieurs tutoriels et captures d'écran, mais ils semblent adaptés à un plugin spécifique.
Par exemple: http://amitgharat.wordpress.com/2013/02/03/an-approach-to-use-jquery-plugins-with-angularjs/ http://www.youtube.com/watch?v=8ozyXwLzFYs
Dois-je créer une directive comme ça -
App.directive('directiveName', function() {
return {
restrict: 'A',
link: function(scope, element, attrs) {
$(element).'pluginActivationFunction'(scope.$eval(attrs.directiveName));
}
};
});
Et puis dans le html appeler le script et la directive?
<div directiveName ></div>
<script type="text/javascript" src="pluginName.js"></script>
Merci d'avance
jquery-plugins
angularjs
Gidon
la source
la source
$(element).pluginActivationFunction(scope.$eval(attrs.directiveName));
sans les guillemets.Réponses:
Oui vous avez raison. Si vous utilisez un plugin jQuery, ne placez pas le code dans le contrôleur. Créez plutôt une directive et placez le code que vous auriez normalement dans la
link
fonction de la directive.Il y a quelques points dans la documentation que vous pouvez consulter. Vous pouvez les trouver ici:
pièges communs
Utiliser correctement les contrôleurs
Assurez-vous que lorsque vous faites référence au script dans votre vue, vous le faites en dernier - une fois que la bibliothèque angularjs, les contrôleurs, les services et les filtres sont référencés.
EDIT: Plutôt que d'utiliser
$(element)
, vous pouvez utiliserangular.element(element)
lorsque vous utilisez AngularJS avec jQueryla source
ng-click
directive via ce paramètre HTML en texte brut)j'ai déjà 2 situations où les directives et les services / usines n'ont pas bien joué.
le scénario est que j'ai (eu) une directive qui a l'injection de dépendances d'un service, et à partir de la directive je demande au service de faire un appel ajax (avec $ http).
à la fin, dans les deux cas, la répétition ng n'a pas du tout été déposée, même lorsque j'ai donné au tableau une valeur initiale.
j'ai même essayé de faire une directive avec un contrôleur et une portée isolée
seulement quand j'ai tout déplacé vers un contrôleur et que cela a fonctionné comme par magie.
exemple à ce sujet ici Initialisation du plugin jQuery (RoyalSlider) dans Angular JS
la source