[jquery-plugins] AngularJS에서 jQuery 플러그인을 통합하는 올바른 방법

jQuery 플러그인을 각도 앱에 통합하는 올바른 방법이 무엇인지 궁금합니다. 여러 튜토리얼과 스크린 캐스트를 찾았지만 특정 플러그인에 적합합니다.

예를 들어 :
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 라이브러리, 컨트롤러, 서비스 및 필터가 참조 된 후에 마지막으로 참조하는지 확인하십시오.

편집 :를 사용하는 대신 jQuery와 함께 AngularJS를 $(element)사용할 angular.element(element)때 사용할 수 있습니다


답변

지시어와 서비스 / 공장이 제대로 작동하지 않는 2 가지 상황이 있습니다.

시나리오는 서비스의 의존성 주입이있는 지시문을 가지고 있었고 지시문에서 서비스에 ajax 호출 ($ http 포함)을 요청하는 것입니다.

결국 두 경우 모두 ng-Repeat는 배열에 초기 값을 주었을 때도 전혀 제출하지 않았습니다.

나는 심지어 컨트롤러와 격리 된 범위로 지시문을 만들려고했습니다.

모든 것을 컨트롤러로 옮겼을 때만 마술처럼 작동했습니다.

여기에 대한 예제 Angular JS에서 jQuery 플러그인 (RoyalSlider) 초기화


답변