wagnerdelima wagnerdelima - 3 months ago 9
AngularJS Question

AngularJS ngRepeat - how to repeat values sequentially

I am trying to do the following html structure using angularjs ngRepeat:

ngRepeat question


Yes, that is a table with two repeated values 1,1, 2, 2 ... ten times.

The code is like this:

<table>
<th>expected</th>
<th>accomplished</th>

</table>


My problem is, when I use ng-repeat, I shall use it in one of the th tag. And so, it will repeat the tag ten times. I'd like to repeat one of the expected and one of the accomplished tag, sequentially.

Any help?? Thanks.

Answer

In the controller:

var values = [];
for (var i = 0; i < 10; i++) {
    values.push({title: 'expected', num: i + 1});
    values.push({title: 'accomplished', num: i + 1});
}
$scope.values = values;

In the view:

<table>
  <thead>
   <tr>
     <th ng-repeat="v in values">{{ v.title }}</th>
   </tr>
 </thead>
 <tbody>
   <td ng-repeat="v in values">{{ v.num }}</th>
 </tbody>
</table>