角2 - 添加/在飞行中删除组件 [英] Angular 2 - Adding / Removing components on the fly

问题描述

我需要能够添加和放大器;除去对飞角2组件。要做到这一点，我使用loadIntoLocation和处置方法，喜欢它：

I need to be able to add & remove angular 2 components on the fly. To do so, I'm using loadIntoLocation and dispose methods, like it:

添加（从布局管理器）组件：

Adding a component (from a layout manager):

this.m_loader.loadIntoLocation(MyComponent, this.m_element, 'content').then(_componentRef => {

    // Create the window and set its title:
    var component: MyComponent = (_componentRef.instance);
    component.ref = _componentRef;

    // init the component content
});

卸下（从组件）的组件：

Removing a component (from the component):

this.ref.dispose();

据接近工作：
- 如果我添加组件，并关闭它，它的工作原理
- 如果我添加几部分组成，他们的工作
- 但如果我添加成分A，然后将其删除，然后添加成分B，好像角度给我一个参考，并保持一些旧的价值观念（我的组件是可拖动的，在这种情况下，B将被创建的被当我把它毁了）

It is nearly working: - if I add a component, and close it, it works - if I add several components, they work - but if I add component A, then remove it, then add component B, it seems like Angular gives me a reference to A, and keeps some old values (my components are draggable, and in this case the B will be created A was when I destroyed it)

有没有一种方法，使角摧毁组件正确，或至少迫使它创造新鲜的？

Is there a way to make Angular destroy components properly, or at least to force it to create fresh ones?

推荐答案

的建议添，

引用@ tbosch的评论

quoting @tbosch's comment

角重用previously创建默认的DOM元素

Angular reuses previously created DOM elements by default

因此​​，为了避免此问题，从注释视为好，你可以使用 APP_VIEW_POOL_CAPACITY 并为它分配 0 作为价值。

So to avoid this behavior, taken from the comment as well, you can use APP_VIEW_POOL_CAPACITY and assign it 0 as value.

bootstrap(MyApp, [provide(APP_VIEW_POOL_CAPACITY, {useValue: 0})])

更新

请注意，由于beta.1 APP_VIEW_POOL_CAPACITY 通过的＃5993 和DOM是否被正确重建。

Update

Note that since beta.1 APP_VIEW_POOL_CAPACITY was removed by #5993 and the DOM is being recreated correctly.

这篇关于角2 - 添加/在飞行中删除组件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！