AngularJS에서 자바스크립트를 사용하여 ng-click 또는 관련 디렉티브를 태그 요소인 DOM에 직접 추가하였을 경우 이벤트가 동작하지 않습니다. 어떻게 해야할까요?


# $compile을 사용하기

$compile 서비스를 사용하면 ng-click 등의 추가된 이벤트에 바인딩하는 것이 가능합니다. 아래와 같이 $compile을 수행합니다.

var element = $('<button ng-click="close();">Close</button>');
document.body.appendChild(element[0]);
$compile(element)($scope);

위 예제소스는 ng-$compile 수행 후 ng-click 이벤트가 정상적으로 동작하는 것을 보여줍니다.