Angularjs 如何删除从父指令注入的组件的范围

我有一个指令，它根据一些输入动态地将子自定义指令添加到DOM中。一切正常。但是，当输入发生更改并且我使用一组不同的子自定义指令重新呈现DOM时，子自定义指令的旧作用域不会被删除，因此，附加到它们的事件处理程序仍在内存中

我正在通过设置元素[0]重新呈现DOM。innerHTML=''。 有没有办法删除/销毁自定义指令的作用域？我在一些文章中看到scope.destroy可以调用，但是如何获得child自定义指令的作用域的引用呢

const linker = function (scope, element) {
scope.$watch('data', function () {
    reRenderToolbar();
}, true);

const reRenderToolbar = function () {
    element[0].innerHTML = '';
    _.forEach(scope.data, function (item, key) {
        const directive = item.CustomDirective;
        scope.options = item.options || {};
        html = '<' + directive + ' options="options"></' + directive + '>';
        element.append(html);
    }


   });
}

    $compile(element.contents())(scope);
    };

const linker=函数（范围、元素）{
范围：$watch（'数据'，函数（）{
reRenderToolbar（）；
}，对）；
const reRenderToolbar=函数（）{
元素[0]。innerHTML=''；
_.forEach（范围、数据、功能（项、键）{
const指令=item.CustomDirective；
scope.options=item.options | |{}；
html=''；
元素。追加（html）；
}
});
}
$compile（element.contents（））（范围）；
};

在自定义指令上处理销毁事件

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

指令（“自定义指令”，函数（）{ 返回{ 限制：“C”， 模板：“自定义指令”， 链接：函数（范围、元素）{ 作用域：$on（“$destroy”，函数（）{ 元素。移除（）； }); } } });

---

在自定义指令上处理销毁事件

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

指令（“自定义指令”，函数（）{ 返回{ 限制：“C”， 模板：“自定义指令”， 链接：函数（范围、元素）{ 作用域：$on（“$destroy”，函数（）{ 元素。移除（）； }); } } });

---

问题在于我没有在父应用程序中销毁childscope，因为我的应用程序是多范围的。这篇文章帮助了我 代码：

const linker=函数（范围、元素）{
范围：$watch（'数据'，函数（）{
reRenderToolbar（）；
}，对）；
让孩子们看看；
const reRenderToolbar=函数（）{
if（儿童镜）{
childScope.$destroy（）；
}
元素[0]。innerHTML=''；
_.forEach（范围、数据、功能（项、键）{
const指令=item.CustomDirective；
scope.options=item.options | |{}；
html=''；
元素。追加（html）；
}
});
}
childScope=scope.$new（）
$compile（element.contents（））（childScope）；
};

问题在于我没有在父应用程序中销毁childscope，因为我的应用程序是多范围的。这篇文章帮助了我 代码：

const linker=函数（范围、元素）{
范围：$watch（'数据'，函数（）{
reRenderToolbar（）；
}，对）；
让孩子们看看；
const reRenderToolbar=函数（）{
if（儿童镜）{
childScope.$destroy（）；
}
元素[0]。innerHTML=''；
_.forEach（范围、数据、功能（项、键）{
const指令=item.CustomDirective；
scope.options=item.options | |{}；
html=''；
元素。追加（html）；
}
});
}
childScope=scope.$new（）
$compile（element.contents（））（childScope）；
};

谢谢！但是我已经试过了。甚至下面的链接也不起作用：function（scope，element）{scope.$on（“$destroy”，（）=>{alert（“侦听作用域时已销毁的元素”）；element.remove（）；}）；element.on（'$destroy'，（）=>{alert（“侦听元素时已销毁的作用域”）；scope.$destroy（）；}）；}我不能拥有

restict:C

，因为我的是元素谢谢！但是我已经试过了。甚至下面的链接也不起作用：function（scope，element）{scope.$on（“$destroy”，（）=>{alert（“侦听作用域时已销毁的元素”）；element.remove（）；}）；element.on（'$destroy'，（）=>{alert（“侦听元素时已销毁的作用域”）；scope.$destroy（）；}）；}我不能使用

restict:C

，因为我的指令是一个元素指令，例如

ng repeat

，

ng include

，

ng if

，.etc，它们创建并销毁DOM，在编译内容之前创建一个新的子范围。它们将编译后的内容链接到新范围。删除元素时，会销毁关联的子作用域。指令（如

ng repeat

，

ng include

，

ng if

，）等创建并销毁DOM，在编译内容之前创建一个新的子作用域。它们将编译后的内容链接到新范围。当它们删除元素时，会销毁关联的子作用域。