显示角度分量v2或v4的列表

Question

我需要显示ts文件中的角度分量的列表 。 我该怎么办？

  // file ResolventePage.ts

  listFormulas: IFormula[] = [{
     name: "Formula 1",
     description: "a description",
     element: AComponent1
  }, {
     name: "Formula 2",
     description: "a description 2",
     element: AComponent2
  }, ... ]

但是我不知道如何在周期内动态放置它：

 <ion-item *ngFor="let item of listFormulas">
   <ion-label>{{ item.name }}</ion-label>

   <!-- Here I need to render the component "item.element" -->
 </ion-item>

非常感谢您的帮助。

Answer 1

如果我理解正确，则listFormulas每个element都是和angular Component。

选项1

首先将所有组件导入.ts文件，例如：

import { AComponent1} from './AComponent1';
import { AComponent2} from './AComponent2';
// ...

然后尝试以下快速技巧：

<ion-item *ngFor="let item of listFormulas">
  <ion-label>{{ item.name }}</ion-label>

  <{{item.element.name}}></{{item.element.name}}>
</ion-item>

选项2

如果不工作，那么这里有一个plunker正确的，但一种先进的方式来做到这一点。 这是非常详细的官方文档中的演示，用于动态加载组件 。