AngularJS - 使用两个对象嵌套的ng-repeat

Question

控制器：

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

}

表格中的data-ng-repeat指令：

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

逻辑如下：

• 列出每个团队时，init（）函数会将对象发送给控制器。
• 在另一方面，init（）函数将与ID团队进行查询，以获得其各自的领导者。
• 该函数将返回一个对象，第二个ng-repeat指令将其列入其各自的团队对象。

但正如我所示，列表错误，因为每个团队都列出了一个相同的对象。

我想在每个对象的init（）函数中创建一个数组，但我不知道如何连接每个对象以创建数组。

有什么建议吗？

Answer 1

我认为您只是在每个请求中更新$scope.leader值，因此最后$scope.leader将为所有团队提供相同的值。试试这个。

$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>
     <tr data-ng-repeat="team in teams" data-ng-init="init(team.id)">
        <td>{{team.name}}</td>
        <td data-ng-repeat="l in leader[team.id]">{{l.name}}</td>
     </tr>
</tbody>  

或者您可以在第二个ng-repeat中使用函数返回前导数组，如：

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