More than one array in ul li loop

Question

I want to display data in ul / li so I am fetching it through loop in my html like :

I have two array where :

  $mainarray = [{"Name":"data1","count":9},{"Name":"data2","count":10},
 {"Name":"data3","count":4},{"Name":"4","count":20}];


 $color = ['red','pink','green','yellow','black'];
 $color = ['red','pink','green','yellow','black'];

I am looping through main array like this and its working fine :

<ul style="list-style-type:circle; padding: 0px !important; font-size:22px;">
<li ng-repeat="item in mainarray " style="margin-bottom: 10px;"; >
    <span style=" font-size: 16px; ">{{ item.name }}</span>
</li>
</ul>

However, I want to add $color with this like :

for data1 -> red
data2->pink 
and so on ....

I have tried with multiple loop but its not working !

Any clues ?

Possible duplicate of [looping multiple arrays simultaneously with ng-repeat](https://stackoverflow.com/questions/30846032/looping-multiple-arrays-simultaneously-with-ng-repeat) — Jigar Shah, Jan 31 '18 at 05:44

score 1 · Accepted Answer · answered Jan 31 '18 at 05:42

1

Your can use $index

<span style=" font-size: 16px; ">{{ item.name }} -> {{ color[$index] }}</span>

answered Jan 31 '18 at 05:42

gurvinder372

66,980
10
72
94

Thanks , but how to place this color in style ? As when i use style = "color={{color[$index]}}, its not working" – CodeWithCoffee Jan 31 '18 at 05:49
@CodeWithCoffee You can try `ng-style` https://stackoverflow.com/questions/21364445/apply-css-style-attribute-dynamically-in-angular-js – gurvinder372 Jan 31 '18 at 05:57
This answer from above link https://stackoverflow.com/a/26301609/1984039 does it with plain style. – gurvinder372 Jan 31 '18 at 05:58
Thanks @gurvinder – CodeWithCoffee Jan 31 '18 at 06:06

More than one array in ul li loop

1 Answers1