Angular 2 - 如何在组件中插入变量

Question

我想动态加载组件。所以，我想这种做法，但它没有工作：

<page-{{current_page}}></page-{{current_page}}> 

目前我使用这种方法，但它似乎并不高效：

<div *ngIf="current_page==1"> 
    <page-1></page-1> 
</div> 
<div *ngIf="current_page==2"> 
    <page-2></page-2> 
</div> 
... 

Answer 1

这是不支持的。字符串插值{{}}只能用于属性-值和元素内容，但不能用于元素名称或属性名称。

也许ViewContainerRef.createComponent()可以做你需要的。

有关示例见Angular 2 dynamic tabs with user-click chosen components

如果你有一组有限的，你要显示的组件，*ngIf或ngSwitchCase是要走的路。