Eu queria saber qual é a maneira correta de integrar plugins jQuery no meu aplicativo angular. Encontrei vários tutoriais e transmissões de tela, mas eles parecem atendidos em um plug-in específico.
Por exemplo: http://amitgharat.wordpress.com/2013/02/03/an-approach-to-use-jquery-plugins-with-angularjs/ http://www.youtube.com/watch?v=8ozyXwLzFYs
Devo criar uma diretiva assim -
App.directive('directiveName', function() {
return {
restrict: 'A',
link: function(scope, element, attrs) {
$(element).'pluginActivationFunction'(scope.$eval(attrs.directiveName));
}
};
});
E então no html chama o script e a diretiva?
<div directiveName ></div>
<script type="text/javascript" src="pluginName.js"></script>
Graças à frente
jquery-plugins
angularjs
Gidon
fonte
fonte
$(element).pluginActivationFunction(scope.$eval(attrs.directiveName));sem as aspas.Respostas:
Sim você está correto. Se você estiver usando um plug-in jQuery, não coloque o código no controlador. Em vez disso, crie uma diretiva e coloque o código que você normalmente teria dentro da
linkfunção da diretiva.Existem alguns pontos na documentação que você pode dar uma olhada. Você pode encontrá-los aqui:
Armadilhas comuns
Usando controladores corretamente
Certifique-se de que ao referenciar o script em sua exibição, você o refira por último - depois que a biblioteca angularjs, controladores, serviços e filtros forem referenciados.
EDIT: Ao invés de usar
$(element), você pode usarangular.element(element)quando usar AngularJS com jQueryfonte
ng-clickdirectiva através deste texto simples HTML parâmetro)Já tenho duas situações em que diretivas e serviços / fábricas não foram bem-sucedidos.
o cenário é que eu tenho (tinha) uma diretiva que possui injeção de dependência de um serviço e, a partir da diretiva, peço ao serviço que faça uma chamada ajax (com $ http).
no final, em ambos os casos, o ng-Repeat não apresentou nenhum arquivo, mesmo quando dei um valor inicial à matriz.
eu até tentei fazer uma diretiva com um controlador e um escopo isolado
somente quando mudei tudo para um controlador e funcionou como mágica.
exemplo sobre isso aqui Inicializando o plugin jQuery (RoyalSlider) no Angular JS
fonte