Уничтожить директиву/дочерний масштаб

У меня есть директива, которая компилирует другую директиву и присоединяет ее к телу с той же переданной областью. Это не будет то же место, что и "родительская" директива.

Когда родительская директива уничтожается, есть ли способ уничтожить также директиву и область действия? Я спрашиваю, потому что после проверки DOM дочерняя директива все еще существует.

В настоящее время я подключаюсь к родительскому событию $destroy, но было любопытно, можно ли его обрабатывать автоматически.

jsFiddle: http://jsfiddle.net/FPx4G/1/

Ребенок остается там, когда вы переключаете родителя, но я бы хотел, чтобы его уничтожили. Каким будет лучший способ сделать это?

HTML:

<div ng-app="app">
    <div ng-controller="ParentCtrl">
        <button data-ng-click="toggleParent()">Toggle Parent</button>
        <div data-ng-switch data-on="displayDirective">
            <div data-ng-switch-when="true">
                <div class="parentDirective">Parent Directive</div>
            </div>
        </div>
    </div>
</div>

JavaScript:

angular.module('app', [])
    .directive("parentDirective", function($compile){
        return {
            restrict: 'C',
            link: function(scope, element){
                var secondDirective = angular.element(document.createElement("div"));
                secondDirective.addClass("childDirective");

                document.body.appendChild(secondDirective[0]);

                $compile(secondDirective)(scope);
            }
        }
    })
    .directive("childDirective", function(){
        return {
            restrict: 'C',
            template: '<div>Child Directive</div>',
            link: function(scope, element){
                scope.$on("destroy", function(){
                   alert(1); 
                });
            }
        }
    });


function ParentCtrl($scope){
   $scope.displayDirective = true;
    $scope.toggleParent = function(){
        $scope.displayDirective = !$scope.displayDirective;
    }
}

Как правило, у меня просто есть вспомогательный элемент в шаблоне исходного шаблона, чтобы он правильно позиционировался. Проблема действительно сводится к работе с z-index. Родительский элемент находится в контейнере, который можно прокручивать, поэтому дочерний элемент (в одном случае - выпадающее меню) будет скрыт/отключен, если он больше контейнера. Для борьбы с этим я вместо этого создаю фактический ребенок в теле документа и поместите его относительно родителя. Он также будет прослушивать события прокрутки для перестановки. У меня все работает, и все в порядке. Это то, что происходит, когда мне нужно удалить родителя... ребенок все еще там.

Ответ 1