Alex Zakruzhetskyi Alex Zakruzhetskyi - 6 months ago 9
AngularJS Question

Using ng-repeat directive on a <tr> element

I use Rails for backend and angularjs for frontend.
In my angularjs controller I have:

app.controller('ReportsInsurerPaymentsCtrl', ['$scope', '$http', function($scope, $http) {

$scope.insurerPayments = [];
$scope.commissions = [];
$scope.insurers = [];

$scope.getInsurerPayments = function () {
$http.get('/reports/insurer_payments.json').success(function (data) {
$scope.insurerPayments = data.payments;
$scope.commissions = data.commissions;
$scope.insurers = data.insurers
})
};

$scope.getInsurerPayments();
}]);


My Rails controller gives me json with 3 arrays:
insurerPayments
,
commissions
and
insurers
. In my view I want to show my
insurers
,
commissions
and
insurerPayments
in a table, so I do something like this:

<table class="table table-bordered table-hover">
<tr>
<th>Insurers</th>
<th>Commissions</th>
<th>Insurer Payments</th>
</tr>
<tr ng-repeat="insurer in insurers">
<td>{{insurer.name}}</td>
<td>{{}}</td>
<td>{{}}</td>
</tr>
</table>


So, how can I do that, using ng-repeat for different arrays? Thank ahead.

Answer

use $index for comparsion

  <tr ng-repeat="insurer in insurers">
    <td>{{insurer.name}}</td>
    <td>{{ commissions[$index] }}</td>
    <td>{{ insurerPayments[$index] }}</td>
  </tr>
Comments