how to add ids dynamically on component in angular js 5?

0
votes

I was trying to fetch the data from an array and displayed in divs. but whenever I loop through, I need to add different ids to every div. can anybody give me a clue how to do that?

here is loop looks like : 

<div class="container2">
   <div *ngFor="let dependants of data[0].dependsOn">

   <app-sequence-element-preview [sequenceElement]='dependants'>
   </app-sequence-element-preview>

   </div>
</div>

for example ,here ngfor will loop through and for every array index, it will store the data in different div. so how can I add ids to that divs.

2
angular

2 Answers

1
votes

You can assign a index and just use it inside it

<div class="container2">
   <div *ngFor="let dependants of data[0].dependsOn;let i=index" id="{{'Id'+i}}">

   <app-sequence-element-preview [sequenceElement]='dependants'>
   </app-sequence-element-preview>

   </div>
</div>
1
votes

This should work:

<div class="container2">
<div id=“div+{{i}}” *ngFor="let dependants of data[0].dependsOn; let i= index>“
 <app-sequence-element-preview [sequenceElement]='dependants'>
 </app-sequence-element-preview>

 </div>
 </div>