从数组追加DOM中的元素

Question

我有：

<div *ngFor="let item of items">
  <h2>Hello {{item.name}}</h2>
</div>

我的物品：

items = [
    {
      name: 'David',
      star: 5
    },
    {
      name: 'George',
      star: 2
    },
    {
      name: 'Michael',
      star: 0
    },
    {
      name: 'Tim',
      star: 1
    },
]

他们呈现：

Hello Tim

等等

如何添加：

<i class="fa fa-star"></i>

高于h2时（在数组中）：

star: 1

等等？ 像这样：

if (this.items.star == 2) {
   <i class="fa fa-star"></i>
   <i class="fa fa-star"></i>
}

（这只是一个“ if语句”示例，用于了解发生了什么情况）

我的朋克： https ://plnkr.co/edit/lfZT6FwenhYkQf1MUx9E ? p = preview

Answer 1

您可以通过以下方式使用*ngIf模板装饰器：

<div *ngFor="let item of items">
  <i class="fa fa-star" *ngIf="item.star === 1></i>
  <h2>Hello {{item.name}}</h2>
</div>

在此处查看更多示例并了解更多信息

* ngIf：根据表达式的值有条件地包括模板。