web-dev-qa-db-fra.com

boucler plusieurs tableaux simultanément avec ng-repeat

Puis-je parcourir deux tableaux simultanément en utilisant un seul ng-repeat dans AngularJs? Si oui, alors comment?

Par exemple, j'ai deux tableaux

array1 = [1,2,3,4,5]

array2 = [6,7,8,9,10]

Il devrait être capable de produire le même index pour les deux tableaux.

htmlangularjs
16
user2851669

Si vous voulez accéder au second tableau avec l'index du premier, essayez ceci:

$scope.arr1 = [1, 2, 3, 4, 5]
$scope.arr2 = [6, 7, 8, 9, 10]

<div ng-repeat="number in arr1">
    Number from array1 = {{number}}
    Number from array2 = {{arr2[$index]}}
</div>

Voir ce violon: http://jsfiddle.net/dm9zhgx9/

29
Rus Paul

À ma connaissance, Angular n'implémente pas l'itération sur plusieurs tableaux.

Une solution consisterait à enchaîner les tableaux et à itérer le résultat.

Essaye ça:

<div ng-repeat="item in [1,2,3,4,5].concat([6,7,8,9,10])">
    {{item}}
</div>
13
jbigman

Si vous souhaitez utiliser ngRepeat pour la combinaison de deux tableaux, utilisez javascript concat () function (AngularJS autorise variable in expression dans la directive ngRepeat).

<div ng-repeat="item in array1.concat(array2)">{{item}}</div>
6
kTT

Angulaire

$http.get("json/timeline.json")
        .then(function(response) {
            var datalen = response.data.tline.length;           
            for (var i=0; i<datalen; i++){
                vm.eventlist.Push(response.data.tline[i]);
                vm.hpos.Push({ 'left' : pos * i + 'px'});
            }

        });

HTML

<li ng-repeat="event in vm.eventlist">
                            <section class="timeline-event past-event" ng-style="{{vm.hpos[$index]}}">
0
M Thomas