Angular 2. Loop of array inside object using ngFor

Question

I have next structure of a component data:

I want to print a list of assignedCards within component's view using *ngFor. I do this possible:

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

But it falls with an exception:

If i test mission value, it says me, that mission is an object.

So, i'd like to access assignedCards array inside mission object and make a loop of it.

Thierry Templier · Accepted Answer · 2016-03-23 12:10:55Z

11

I guess that the mission object is loaded asynchronously. So it's undefined at a first time and is set later...

So you could use the Elvis operator (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>

answered Mar 23, 2016 at 12:10

Thierry Templier

203k44 gold badges407 silver badges365 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Angular 2. Loop of array inside object using ngFor

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related