destroy directive/child scope on scope destroy

Question

I have a directive that compiles another directive and attaches it to the body with the same scope passed. This will not be the same location as the \"parent\" directive.

Answer 1

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

updated fiddle : http://jsfiddle.net/C8hs6/