Javascript AngularJs-删除/销毁元素后清理 脚本

我有一个指令，它将目标元素包装在一个div中，以包含使用该指令创建的其他UI元素，我的问题是，当我试图在源元素即将从DOM中销毁/删除时打开它时，它会导致浏览器进入无限循环

样品 这是重现问题的示例代码：

angular.module('myDirective', []).directive('myDirective', function() {
  return {
    link: function(scope, element, attrs) {
      function wrapElement() {
        element.wrap('<div class="my-directive-container"></div>');
      }

      function unwrapElement() {
        element.parent().replaceWith(element);
      }

      // Listen for the destroy event on the element
      element.on('$destroy', unwrapElement);

      wrapElement();
    }
  };
});

angular.module（'myDirective'，[]）.directive（'myDirective'，function（）{
返回{
链接：函数（范围、元素、属性）{
函数wraplement（）{
元素。包裹（“”）；
}
函数展开（）{
element.parent（）替换为（element）；
}
//侦听元素上的销毁事件
元素上（“$destroy”，unwrapElement）；
绞缠（）；
}
};
});

问题 我的问题是，在源元素被移除后，如何打开或除去容器元素

不停摆弄 这是一个工作原理，当您尝试删除元素时，不会发生任何事情，因为控制台中将显示“超出最大调用堆栈大小”错误。

如果您可以升级（至少1.2.6），请使用而不是

上的
，否则手动注销处理程序：

function unwrapElement() {
    element.off('$destroy', unwrapElement);
    // this could also be just element.parent().remove() instead
    element.parent().replaceWith(element);
}

谢谢你@ferada，这真是太棒了！我之所以要进行替换，是因为可以手动调用相同的函数来销毁创建的UI，而无需删除源元素。干杯