首先让我说我肯定是Angular的新手，但我已经做了一些挖掘，并没有发现其他任何人试图以相同的限制来做这件事。
我正在尝试使用包含来自JSON对象的信息行的外部表创建嵌套表。在这个外部表的每一行下面，我需要生成另一个表，其中包含来自使用外部表行信息检索的JSON对象的信息。我遇到的问题是确保内表中的信息对于外表中的每一行都是不同的。现在，我遇到了一个问题，在我的脚本循环到下一个外行并更改每个内部行的信息直到脚本之前，我会在每个内部行中显示每个外部行的信息。到达外行的末尾。
我正在使用在线应用程序，没有真正的数据库访问权限，因此需要从URL中获取表所需的数据。
以下是我的脚本：
var projectApp = angular.module('projectEditor', []);
var parents = [];
projectApp.controller('ProjectController', [ '$scope', '$http',
function($scope, $http, msSvc) {
$scope.isLoaded = false;
$scope.loading = true;
$scope.url = '/api/now/table/';
$http.defaults.headers.common.Accept = "application/json";
$scope.updatePrjList = function() {
$http({
method: 'GET',
url: $scope.url + "pm_project?sysparm_query=active=true^ORDERBYDESCend_date&sysparm_limit=5&sysparm_display_value=true"
}).
success( function(data, status) {
$scope.loading = false;
$scope.isLoaded = true;
$scope.projects = data.result;
//parents.length = $scope.projects.length;
for (var i=0; i< $scope.projects.length; i++) {
parents.push($scope.projects[i].sys_id);
//console.log($scope.projects[i]);
}
$scope.updateMSList(parents);
}).
error( function(data, status) {
$scope.projects = [{"number": "Error fetching projects list"}];
});
};
$scope.updateMSList = function(msURL) {
console.log("URL: " + msURL);
for (var i=0; i< msURL.length; i++) {
$http({
method: 'GET',
url: $scope.url + "pm_project_task?sysparm_query=active=true^ORDERBYDESCend_date^parent=" + msURL[i] + "&sysparm_limit=5&sysparm_display_value=true"
}).
success( function(data, status) {
$scope.loading = false;
$scope.isLoaded = true;
$scope.milestones = data.result;
var i;
var l = $scope.milestones.length;
for (i=0; i< l; i++) {
//console.log($scope.milestones[i]);
}
}).
error( function(data, status) {
$scope.milestones = [{"number": "Error fetching milestones list"}];
});
}
};
$scope.updatePrjList();
}] );
});<div class="container col-md-12" ng-app="projectEditor">
<div class="row" ng-controller="ProjectController">
<div class="panel panel-default">
<table class="table table-striped">
<thead>
<tr>
<th class="normal-cell col-md-1">Project</th>
<th class="normal-cell col-md-1">#</th>
<th class="normal-cell col-md-1">Percent Complete</th>
<th class="normal-cell col-md-1">Project Manager</th>
<th class="normal-cell col-md-1">Requestor</th>
<th class="normal-cell col-md-1">Portal/Application</th>
<th class="normal-cell col-md-1">State</th>
<th class="normal-cell col-md-1">Project Health</th>
<th class="normal-cell col-md-1">Target Date</th>
<th class="normal-cell col-md-1">Committed Date</th>
<th class="normal-cell col-md-1">Planned Impl. Date</th>
</tr>
</thead>
<tbody ng-show="isLoaded">
<tr ng-repeat="proj in projects">
<td colspan="12">
<table>
<tr>
<td class="normal-cell col-md-1"><a class="project-link" href="pm_project.do?sys_id={{proj.sys_id}}" style="color: #91b4c5; font-weight: 600;">{{proj.number}}</a><div>{{proj.short_description}}</div></td>
<td class="normal-cell col-md-1">{{proj.u_ranking}}</td>
<td class="normal-cell col-md-1"><pct-complete value="proj.percent_complete"></pct-complete></td>
<td class="normal-cell col-md-1">Test PM</td>
<td class="normal-cell col-md-1">Test Requester</td>
<td class="normal-cell col-md-1">Test Portal</td>
<td class="normal-cell col-md-1">{{proj.state}}</td>
<td class="normal-cell col-md-1">{{proj.u_health}}</td>
<td class="normal-cell col-md-1">Test Target</td>
<td class="normal-cell col-md-1">Test Commit</td>
<td class="normal-cell col-md-1">{{proj.start_date}}</td>
</tr>
<tr>
<table class="table table-striped col-md-12">
<thead>
<tr>
<th class="col-md-6 text-center">Project Description</th>
<th class="col-md-3 text-center">Milestone Name</th>
<th class="col-md-1 text-center">Planned Finish</th>
<th class="col-md-1 text-center">Actual Finish</th>
<th class="col-md-1 text-center">Status</th>
</tr>
</thead>
<tr ng-repeat="ms in milestones">
<td class="col-md-6">{{proj.description}}</td>
<td class="col-md-3">{{ms.short_description}}</td>
<td class="col-md-1">{{ms.start_date}}</td>
<td class="col-md-1">{{ms.end_date}}</td>
<td class="col-md-1">{{ms.state}}</td>
</tr>
</table>
</tr>
</table>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>