ng-repeat on two arrays

Question

I want to do a ng-repeat on an array which is composed of two arrays, like this :

[titles: [], links: []]

My arrays (titles and links) have the same length What i want to print in my ng-repeat, finally, is anything like that :

{{ array.title }}
{{ array.link }}

For example, in a C program i have to do that :

int i;

i = 0;
while (titles[i])
{
    printf("%s - %s", titles[i], links[i]);
    i++;
}

Solution 1

It's not clear how you have your data — [titles: [], links: []] isn't meaningful.

Ideally you would arrange your data as an array of objects that looks like:

var array = [{title: "foo", link: "bar"}, {title…etc]

Then you could just use:

<div ng-repeat="obj in array">
   {{obj.title}},  {{obj.link}}

If you know that titles and links will always be the same size you can do this, but it's not very pretty and might be a little fragile:

<div ng-repeat="title in titles">
   {{title}}, {{links[$index]}}
</div>

Solution 2

This is how it worked for me:

<ion-item ng-repeat="name in product.names">
    Buy {{name}} for {{product.prices[$index]}}
</ion-item>

I had both product.names and product.prices of same size

Solution 3

If the length is the same, then make it an object rather than two arrays.

plunker

<ui ng-repeat="movie in movies">
  <li>{{movie.t}} located in {{movie.l}}</li>
</ui>