将空数据推入角度js的嵌套数组中

时间:2015-06-28 17:33:11

标签: angularjs

我对角度有点新意,并感谢任何帮助。我正在创建一个简单的报告系统,其结构如下

报告可以包含多个子报告

和子报表可以有很多任务。

这是我的代码结构

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

我有两个挑战..

  1. 当我从txt文件中获取数据时,我无法使用单个标题显示我的表格,如下所示:

    SubId | ProjName | TaskId | TASKNAME

    1. ABC。 1.任务1-1 .......... 2.任务1-2 .......... 3. Task1-3
    2. Proj2。 1.任务2-1  ......... 2. Task2-2
    3. 这里我使用了嵌套的ng-repeat,但是如果$ parent。$ index = 0,我似乎使用ng-show第一行子报告信息来迭代任务,但是它不断为子报告创建一个新表。

    4. 如何在没有任务的情况下将子报表添加/推送到报表

    5. 我将不胜感激。我正在使用我的手机,否则我会发布一些代码。

      注意我是如何在Task上使用ng-repeat的,以便只显示任务索引= 0的子报表。我只希望仅在第一个任务上显示子报表信息。我使用Modal来保存subreporrt,但问题是没有显示子报告,因为在保存子报告时它没有任务 - henc它没有显示。

      我想知道在向其添加任务之前先保存子报表的最佳方法,以及如何让信息在桌面上正确显示

0 个答案:

没有答案