Angular 使用组件作为元素-角度8

我想使用一个组件作为一个项目
而不是使用：

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

{{biblCit}}

我想使用如下内容：

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

{{biblCit}}

---

作为angular的新手，我不知道如何解决这个问题。

您可以使用迭代器

*ngFor

对组件进行迭代：

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

这里是

.ts

.html

您可以在组件模板上使用

，这将从父级投影模板

书目组件模板

母公司

<app-bibliography *ngFor="let biblCit of biblCits">
        You can use 
<ng-content></ng-content>
 inside of your 
evt-bibliography-item
 component's template to access everything passed between your own component tags, in your case the value of 
{{ biblCit }}


@Component({
  selector: 'evt-bibliography-item',
    template: '<ng-content></ng-content>'
})
export class BibliographyItem {
}


您可以使用
在您的
evt参考书目项中
组件的模板来访问您自己的组件标记之间传递的所有内容，在您的例子中，
{{biblCit}}

@组件({
选择器：“evt书目项目”，
模板：“”
})
出口类书目项目{
}
您已经尝试了什么？我尝试创建一个空组件并用标记调用它，但它显然是不完整的代码。@downvoter downvote的原因是什么？改进我的回复将非常有帮助
evt参考书目项目
是未知的element@Memmo看起来您没有在
app.module
或其他地方导入组件。如果它是独立组件，那么是的，导入到
app.module.ts
@downvoter中有什么理由拒绝投票？如果能提高我的回答，那将非常有帮助。对我来说，这是一个正确的解决方案！我不得不读字里行间的东西，但最终我意识到这正是我要找的@胡萌萌
<div *ngFor="let biblCit of biblCits">
    <child-component [parentTimerCount]="biblCit">
    </child-component>
</div>

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

<app-bibliography *ngFor="let biblCit of biblCits">
        You can use 
<ng-content></ng-content>
 inside of your 
evt-bibliography-item
 component's template to access everything passed between your own component tags, in your case the value of 
{{ biblCit }}


@Component({
  selector: 'evt-bibliography-item',
    template: '<ng-content></ng-content>'
})
export class BibliographyItem {
}