动态地将Angular2组件附加到dom

Question

我希望能够单击按钮以添加新组件。因此，例如，如果Angular 2更像Angular 1，我可以做到：

.as-console-wrapper {
  max-height: 100%!important;
}

TS：

<button (click)="addComponent()">add</button>

注意：我知道在这里已经问了几次类似的问题，但我读过的答案是矛盾的，而且大多依赖于不推荐的代码，例如DynamicComponentLoader。我无法在官方文档中找到任何相关信息，理想情况下想要找到一种标准化的方法。

Answer 1

没有。 Angular 2几乎与Angular 1一样，在Angular 1中执行此操作从未成为操作DOM的推荐方法。

推荐的方法是修改模型，并使用模板从模型生成HTML：

private components = [];

addComponent() {
    this.components.push({}); // this object would typically contain the inputs of the component
}

并在模板中：

<component-selector *ngFor="let c of components"></component-selector>