我对角度有点新意,并感谢任何帮助。我正在创建一个简单的报告系统,其结构如下
报告可以包含多个子报告
和子报表可以有很多任务。
这是我的代码结构
var Report = {
"ReportId":1,
"ReportDate":"02/05/2015",
"SubReport":[
{
"SubId": 1,
"ProjectName": "An ice sculpture",
"ProjectDeliverable":"My Deliverable1",
"ProjectTarget":"My Target1",
"Task":[
{
"TaskPerformed": "Task Performed 1 of 1",
"TimeSpent": 3,
"ResultAchieved": "Result 1 of 1" ,
"PlannedActivity": "Planned Activity 1 of 1"
}]
}]
};
<table class="table table-bordered table-condensed">
<tbody ng-repeat="subrep in Report.SubReport">
<tr>
<td>
<table class="table table-bordered table-condensed">
<thead ng-show="$index==0">
<tr>
<th >ACTION</th>
<th>Project Name</th>
<th>Project Deliverable</th>
<th>Target</th>
<th>Task Performed</th>
<th>Time Spent(Hrs)</th>
<th>Result Achieved</th>
<th>Planned Activity</th>
<th >ACTION</th>
</tr>
</thead>
<tbody>
<tr ng-show="$index==0" ng-repeat="tsk in subrep.Task">
<td>
<div class="btn-group">
<a class="btn btn-info" href="" ng-click="addNew()" ng-
show="$parent.$index==0" title="New SubReport" >
<i class="fa fa-plus"></i>
</a>
<a class="btn btn-green" href="" title="Edit SubReport" data-
toggle="modal" data-target="#">
<i class="fa fa-pencil-square-o"></i>
</a>
<a class="btn btn-danger" title="Delete SubReport" href="">
<i class="fa fa-trash-o"></i>
</a></div>
</td>
<td>{{subrep.ProjectName}}</td>
<td>{{subrep.ProjectDeliverable}}</td>
<td>{{subrep.ProjectTarget}}</td>
<td>{{tsk.TaskPerformed}}</td>
<td>{{tsk.TimeSpent}}</td>
<td>{{tsk.ResultAchieved}}</td>
<td>{{tsk.PlannedActivity}}</td>
<td>
<div class="btn-group">
<a class="btn btn-info" href="" data-toggle="modal" title="New
Task" data-target="#NewTask">
<i class="fa fa-plus"></i>
</a>
<a class="btn btn-green" href="tsk={{$index}}/sub={{$parent.
$index}}" title="Edit Task" data-toggle="modal" data-target="#defaultmodal">
<i class="fa fa-pencil-square-o"></i>
</a>
<a class="btn btn-danger" title="Delete Task" href="">
<i class="fa fa-trash-o"></i>
</a>
</div>
</td>
</tr>
<tr ng-show="$index>0" ng-repeat="tsk in subrep.Task">
<td colspan="4"></td>
<td>{{tsk.TaskPerformed}}</td>
<td>{{tsk.TimeSpent}}</td>
<td>{{tsk.ResultAchieved}}</td>
<td>{{tsk.PlannedActivity}}</td>
<td>
<div class="btn-group">
<a class="btn btn-green" href="tsk={{$index}}/sub={{$parent.
$index}}" title="Edit Task" data-toggle="modal" data-target="#defaultmodal">
<i class="fa fa-pencil-square-o"></i>
</a>
<a class="btn btn-danger" title="Delete Task" href="">
<i class="fa fa-trash-o"></i>
</a>
</div>
</td>
<td>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
我的工厂尝试在现有报告中保存子报告
fac.AddSubReport = function (data) {
Report.SubReport.push(data);
return Report;
}
return fac;
enter code here
我有两个挑战..
当我从txt文件中获取数据时,我无法使用单个标题显示我的表格,如下所示:
SubId | ProjName | TaskId | TASKNAME
这里我使用了嵌套的ng-repeat,但是如果$ parent。$ index = 0,我似乎使用ng-show第一行子报告信息来迭代任务,但是它不断为子报告创建一个新表。
如何在没有任务的情况下将子报表添加/推送到报表
我将不胜感激。我正在使用我的手机,否则我会发布一些代码。
注意我是如何在Task上使用ng-repeat的,以便只显示任务索引= 0的子报表。我只希望仅在第一个任务上显示子报表信息。我使用Modal来保存subreporrt,但问题是没有显示子报告,因为在保存子报告时它没有任务 - henc它没有显示。
我想知道在向其添加任务之前先保存子报表的最佳方法,以及如何让信息在桌面上正确显示