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

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

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

<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):

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

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

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

所以,我想访问 assignedCards 对象内的 mission 数组并对其进行循环。

最佳答案

我猜 mission 对象是异步加载的。所以它在第一次是未定义的,稍后会设置......

因此,您可以使用 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>

关于javascript - Angular 2. 使用 ngFor 在对象内部循环数组,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/36177821/

10-09 22:56