Angularjs – 컨트롤러 밖에서 컨트롤러 안의 함수 실행

대부분은 아래와 같이 함수를 호출하게 된다.

<div id="testDiv" ng-app='MyModule' ng-controller="MyController">
    <a href="#" ng-click="callAlert('click-A')">클릭 A</a>
</div>

 클릭 A 라는 글자를 클릭하게 되면 스크립트 파일에서 controller 안의 함수를 호출한다.

angular.module('MyModule', [])
    .controller('MyController', function ($scope) {
    $scope.callAlert = function (data) {
        alert(data);
    };
});

값을 받은 callAlert 함수는 알럿창으로 click-A라고 출력하게 된다.

여기까지는 가장 일반적인 스코프안의 함수 실행이다.

그러나 스크립트 파일에서 angular controller 밖에서 해당 함수를 호출해야하는 경우가 생긴다.

angular.element(document.getElementById('testDiv')).scope().callAlert('click-B');

 이런 식으로 dom에서 id로 선택자를 찾고 함수를 실행한다.

아래 예제를 통해서 결과값을 확인해보자.

TOP