我希望能够单击按钮来添加新组件。例如,如果 Angular 2 更像 Angular 1,我可以这样做:
<button (click)="addComponent()">add</button>
ts:
addComponent():void {
let component = $compile('<component-selector></component-selector>')(scope)
ele.append(component)
}
注意:我知道类似的问题已经在这里被问过几次,但我读到的答案是矛盾的,并且主要依赖于已弃用的代码,例如 DynamicComponentLoader。我在官方文档中找不到任何相关内容,并且理想情况下希望找到一种标准化的方法来执行此操作。
最佳答案
没有。 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>
关于angularjs - 动态地将 Angular2 组件附加到 dom,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40548914/