如何清除Angular2中选择器内的DOM内容答案

【问题标题】：How do I clear the DOM contents inside a selector in Angular2如何清除Angular2中选择器内的DOM内容
【发布时间】：2017-05-12 07:38:24
【问题描述】：

我正在尝试加载包装在 Angular2 组件中的 Kenod Pivot 网格。我根据用户事件（如按钮单击事件）加载 kenod 网格。当我第一次加载剑道网格时，它加载得很好。但是当用户反复单击按钮时，我希望删除先前加载的网格内容并使用最新数据加载新网格。相反，它的行为方式是在先前加载的网格下方附加或加载新网格。请找到有关加载同一组件的多个实例的快照

我尝试了以下代码来清除指定选择器内现有的 DOM 内容。

 this.temp = jQuery(this.elementRef.nativeElement).children('#pivotgrd').html('');
this.dataSource = ... //assign json values to this...

this.pivotgrid = jQuery(this.elementRef.nativeElement).find('#pivotgrd').kendoPivotGrid(
            this.dataSource
         ).data("kendoPivotGrid");

要加载的 HTML 中的选择器

<div>
    <div id="pivotgrd" class="hidden-on-narrow"></div>
</div>

但它没有按预期工作。

请告诉我如何清除之前加载的内容。

【问题讨论】：

您只需要自己删除现有的。这不是 Angular 的错。
提供组件代码
@Dummy，让我知道如何删除现有的？这就是我要找的，我上面指定的代码没有按预期工作，我不确定删除现有代码的正确方法是什么？

标签： angular angular2-directives

【解决方案1】：

这是使用 jquery 删除 DOM 元素的方法。在向您的数据透视表添加新内容之前调用它

jQuery('#pivotgrd').children().remove()

【讨论】：