Zastanawiałem się, jaki jest właściwy sposób integracji wtyczek jQuery z moją aplikacją kątową. Znalazłem kilka samouczków i rzutów ekranowych, ale wydają się one dostosowane do konkretnej wtyczki.
Na przykład: http://amitgharat.wordpress.com/2013/02/03/an-approach-to-use-jquery-plugins-with-angularjs/ http://www.youtube.com/watch?v=8ozyXwLzFYs
Czy powinienem stworzyć taką dyrektywę -
App.directive('directiveName', function() {
return {
restrict: 'A',
link: function(scope, element, attrs) {
$(element).'pluginActivationFunction'(scope.$eval(attrs.directiveName));
}
};
});
A następnie w html wywołać skrypt i dyrektywę?
<div directiveName ></div>
<script type="text/javascript" src="pluginName.js"></script>
Dzięki z góry
jquery-plugins
angularjs
Gidon
źródło
źródło
$(element).pluginActivationFunction(scope.$eval(attrs.directiveName));
bez cytatów.Odpowiedzi:
Tak, masz rację. Jeśli używasz wtyczki jQuery, nie umieszczaj kodu w kontrolerze. Zamiast tego utwórz dyrektywę i umieść kod, który normalnie posiadasz w
link
funkcji dyrektywy.Dokumentacja zawiera kilka punktów, na które można spojrzeć. Można je znaleźć tutaj:
Typowe pułapki
Prawidłowe używanie kontrolerów
Upewnij się, że kiedy odwołujesz się do skryptu w swoim widoku, odwołujesz się do niego na końcu - po odwołaniu do biblioteki angularjs, kontrolerów, usług i filtrów.
EDYCJA: Zamiast używać
$(element)
, możesz skorzystać zangular.element(element)
AngularJS z jQueryźródło
ng-click
dyrektywę za pomocą tego parametru HTML w postaci zwykłego tekstu)Mam już 2 sytuacje, w których dyrektywy i usługi / fabryki nie grały dobrze.
scenariusz jest taki, że mam (miałem) dyrektywę, która ma wstrzykiwanie zależności usługi, a na podstawie tej dyrektywy proszę usługę o wywołanie ajax (za pomocą $ http).
w końcu w obu przypadkach ng-Repeat w ogóle nie zapisał pliku, nawet gdy podałem tablicy wartość początkową.
Próbowałem nawet stworzyć dyrektywę z kontrolerem i izolowanym zakresem
tylko kiedy przeniosłem wszystko do kontrolera i działało to jak magia.
przykład na ten temat tutaj Inicjalizacja wtyczki jQuery (RoyalSlider) w Angular JS
źródło