Angularjs - Nested Ng-repeat Using Two Objects

Controller: $scope.init = function(team){ $http.get('/getLeaderByTeamID/'+team.id) .success(function (data, status, headers, config) { // this is the object that I

Solution 1:

I think you'r just updating $scope.leader value in every request ,so at the end $scope.leader will have the same value for all teams. try this.

$scope.init = function(teamId){
$http.get("/getLeaderByTeamID/"+teamId)
.success(function (data, status, headers, config) {
    // this is the object that I need to list in the table
    $scope.leader[teamId] = data;
})
.error(function (data, status, header, config) {
    $log.error("Error!");
});



<table>
<thead><tr><th>Team</th><th>Leader</th></tr></thead><tbody><trdata-ng-repeat="team in teams"data-ng-init="init(team.id)"><td>{{team.name}}</td><tddata-ng-repeat="l in leader[team.id]">{{l.name}}</td></tr></tbody>

or you can use function return leaders array in the second ng-repeat like:

<tddata-ng-repeat="l in getLeader(team.id)">{{l.name}}</td>