Question

以前使用DynamicComponentLoader，我能够这样写：

import {Directive, Component, ViewContainerRef, DynamicComponentLoader} from '@angular/core';

@Directive({
  selector: '[some-directive]'
})
export class SomeDirective {
  costructor(dcl: DynamicComponentLoader, viewContainerRef: ViewContainerRef) {
    // fetch template from the server
    fetch(...).then((template) => {
      @Component({
        selector: 'div[some-relatively-unique-attribute-name]',
        template: template
      })
      class AdHocComponent {}

      dcl.loadNextToLocation(AdHocComponent, viewContainerRef).then(() => {
        console.log('success');
      });
    });
  }
}

现在使用angular2 final和NgModules我看到如下示例：http://plnkr.co/edit/P0spNzu8JbQad2aKACsX?p=info

（在这里讨论https://github.com/angular/angular/issues/10735）

要动态加载HelloComponent，但它需要在创建根NgModule时预先声明HelloComponent。

如何将ad-hoc创建的组件加载到我的视图中？

我发现了这个：http://plnkr.co/edit/wh4VJG?p=preview 但实现像这样的简单任务是一个疯狂的代码量。

Answer 1

这可能是您正在寻找的内容：

ItemClick

另请参见实时 Plunker

加载在angular2 final中动态创建的动态组件

1 个答案: