javascript - Angular 2.使用ngFor在对象内部循环数组

Question

我有下一个组件数据结构:

我想使用 *ngFor 在组件 View 中打印 assignedCards 列表。我这样做可能:

<div *ngFor="#item of mission.assignedCards" class="b-progress-bar__item m-progress-bar__item_completed">
<div class="b-progress-bar__inner">{{item}}</div>
</div>

但它有一个异常(exception):

如果我测试 mission 值，它告诉我，mission 是一个对象。

因此，我想访问 mission 对象中的 assignedCards 数组并对其进行循环。

Answer 1

我猜 mission 对象是异步加载的。所以第一次是undefined，后来才设置...

因此您可以使用 Elvis 运算符(mission?.assignedCards):

<div *ngFor="#item of mission?.assignedCards"
      class="b-progress-bar__item m-progress-bar__item_completed">
  <div class="b-progress-bar__inner">{{item}}</div>
</div>