即时添加/删除组件

Question

我需要能够动态添加和删除角度2组件.为此,我正在使用loadIntoLocation和dispose方法,如下所示:

添加组件(来自布局管理器):

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
});

删除组件(从组件中):

this.ref.dispose();

它几乎正常工作: - 如果我添加一个组件,并关闭它,它可以工作 - 如果我添加几个组件,它们工作 - 但如果我添加组件A,然后删除它,然后添加组件B,似乎Angular给了我对A的引用,并保留一些旧的值(我的组件是可拖动的,在这种情况下,B将被创建A,当我销毁它时)

有没有办法让Angular摧毁组件,或者至少强制它创建新组件？

Answer 1

正如蒂姆所说,

引用@ tbosch的评论

Angular默认重用以前创建的DOM元素

因此,为了避免这种行为,也可以从注释中获取,您可以使用APP_VIEW_POOL_CAPACITY它并将其指定0为值.

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

更新

请注意,由于#5993APP_VIEW_POOL_CAPACITY删除了beta.1,因此正在重新创建DOM.