使用组件作为单元-角8。

Question

我想用一个组件作为一个项目。

而不是使用：

<ul class='biblList'>
    <li *ngFor="let biblCit of biblCits">
        {{ biblCit }}
    </li>
</ul>

我想用这样的方法：

<evt-bibliography-item *ngFor="let biblCit of biblCits">
    {{ biblCit }}
</evt-bibliography-item>

作为一个有棱角的新手，我不知道怎么弄清楚。

Answer 1

您可以在组件模板上使用<ng-content></ng-content>，这将从父模板中投射模板。

书目组件模板

<div>
<ng-content></ng-content>
</div>

父级

<app-bibliography *ngFor="let biblCit of biblCits">
         {{ biblCit }} 
</app-bibliography>

Answer 2

这是工作实例

.ts

biblCits=['1','2','2','3','4','5']

.html

<div *ngFor="let biblCit of biblCits">
    <child-component [parentTimerCount]="biblCit">
    </child-component>
</div>

Answer 3

您可以使用迭代器*ngFor遍历组件：

<ng-content *ngFor="let biblCit of biblCits">
  <evt-bibliography-item></evt-bibliography-item>
</ng-content>