销毁使用Renderer2创建的元素的正确方法是什么？

在我们的代码库，我们有一个使用Renderer2创建这样一个div一个虚拟的重复指令：销毁使用Renderer2创建的元素的正确方法是什么？

this.renderer2.createElement('div');

在ngOnDestroy方法，我们正在摧毁它像这样：

this.renderer.destroyNode(this.offsetBeforeEl);

这工作得很好我们没有遇到任何问题，直到我们建立在PROD模式的应用，我们开始收到以下错误：

main.js?d73b003…:formatted:87193 Uncaught (in promise) TypeError: this.renderer.destroyNode is not a function

我添加了一个面包机kpoint到那条线，发现其实destroyNode不是Renderer2上的一个方法。我去了棱角分明的源代码，发现在抽象类确定指标的方法上面的评论：

/** 
    * This property is allowed to be null/undefined, 
    * in which case the view engine won't call it. 
    * This is used as a performance optimization for production mode. 
    */ 
    destroyNode: ((node: any) => void)|null;

所以我检查了代码视图，看到这一点：

if (view.renderer.destroyNode) { 
    destroyViewNodes(view); 
} 
if (isComponentView(view)) { 
    view.renderer.destroy(); 
}

如果我不能依赖此方法存在，那么销毁使用Renderer2动态创建的节点的正确方法是什么？

来源

2017-06-09 instantaphex

使用renderer.removeChild方法。

until we built the application in prod mode

destroyNode方法在其上没有在生产模式中使用的DebugRenderer2定义。

function execRenderNodeAction(
    view: ViewData, renderNode: any, action: RenderNodeAction, parentNode: any, nextSibling: any, 
    target?: any[]) { 
    const renderer = view.renderer; 
    switch (action) { 
    case RenderNodeAction.RemoveChild: 
     renderer.removeChild(parentNode, renderNode); 
     break;

所以，使用removeChild这样的：：

const parent = this.renderer.createElement('div'); 
    const child = this.renderer.createElement('span'); 
    this.renderer.appendChild(parent, child); 

    // using remove child 
    this.renderer.removeChild(parent, child);

处理节点移除正确的方法可以从角的方式它，例如此execRenderNodeAction函数来推断

来源

2017-06-10 04:43:52

销毁使用Renderer2创建的元素的正确方法是什么？

回答

相关问题