基于对象属性使用ngFor多次重复HTML元素

Question

使用Angular，我正在创建一个对象， starStructure基于每个对象的vote_average 。 这是我的对象数组的样子：

[
  {"title":"Solo: A Star Wars Story",
   "vote_average":7.1,
   "starStructure":{"full":3,
                    "halfStar":true
                   }
   },
  {"title":"Jurassic World: Fallen Kingdom",
   "vote_average":6.5,
   "starStructure":{"full":3}
  }
]

如何使用*ngFor重复<i class="material-icons">star</i>达到starStructure.full列出的starStructure.full ？

我为这个问题创建了一个StackBlitz 。

Answer 1

返回一个大小的数组

arr(size: number) {
  return Array.from(Array(size), (_, i) => i);
}

和ng为它

<i class="material-icons" *ngFor="let i of arr(movie.starStructure.full)">
  star
</i>

https://stackblitz.com/edit/angular-h4wwbh