【问题标题】:how to write multiple nested ng-repeat in blow json format如何以 Blow json 格式编写多个嵌套的 ng-repeat
【发布时间】:2017-03-17 10:49:09
【问题描述】:

我正在尝试使用多个嵌套的 ng-repeat 来绑定 json 格式的数据

这是我目前写的代码:

$scope.LeavesStatastics = {
            "departMentLeaveStatisticss": [
               {
                   "depId": 1,
                   "depName": "System Admin",
                   "employeeStatisticss": [
                      {
                          "empId": 1,
                          "empName": "Rahul",
                          "reportingManagerId": 1,
                          "employeeLeaveTypeStatisticsList": [
                             {
                                 "employeeLeaveTypeId": 1,
                                 "leaveName": "something",
                                 "maxLeave": 1,
                                 "totalLeaveTaken": 0.0,
                                 "additionalLeave": 0.0,
                                 "lopLeave": 0.0,
                                 "resetDate": null
                             },
                             {
                                 "employeeLeaveTypeId": 2,
                                 "leaveName": "festival",
                                 "maxLeave": 1,
                                 "totalLeaveTaken": 0.0,
                                 "additionalLeave": 0.0,
                                 "lopLeave": 0.0,
                                 "resetDate": "2016-12-22"
                             },
                             {
                                 "employeeLeaveTypeId": 3,
                                 "leaveName": "Fiver",
                                 "maxLeave": 1,
                                 "totalLeaveTaken": 0.0,
                                 "additionalLeave": 0.0,
                                 "lopLeave": 0.0,
                                 "resetDate": "2017-03-14"
                             }
                          ]
                      }
                   ]
               },
               {
                   "depId": 2,
                   "depName": "Science",
                   "employeeStatisticss": [
                      {
                          "empId": 2,
                          "empName": "Anil",
                          "reportingManagerId": 1,
                          "employeeLeaveTypeStatisticsList": [
                             {
                                 "employeeLeaveTypeId": 1,
                                 "leaveName": "something",
                                 "maxLeave": 1,
                                 "totalLeaveTaken": 0.0,
                                 "additionalLeave": 0.0,
                                 "lopLeave": 0.0,
                                 "resetDate": null
                             },
                             {
                                 "employeeLeaveTypeId": 2,
                                 "leaveName": "festival",
                                 "maxLeave": 1,
                                 "totalLeaveTaken": 0.0,
                                 "additionalLeave": 0.0,
                                 "lopLeave": 0.0,
                                 "resetDate": null
                             },
                             {
                                 "employeeLeaveTypeId": 3,
                                 "leaveName": "Fiver",
                                 "maxLeave": 1,
                                 "totalLeaveTaken": 0.0,
                                 "additionalLeave": 0.0,
                                 "lopLeave": 0.0,
                                 "resetDate": "2017-03-13"
                             }
                          ]
                      }
                   ]
               }
            ]
        }

请看一下我写的html部分:

<tr ng-repeat="y in x.employeeStatisticss">
                    <td>
                        {{ y.empName }}
                    </td>
                    <td ng-repeat="z in y.employeeLeaveTypeStatisticsList">
                        {{ z.maxLeave }}
                    </td>
                    <td ng-repeat="z in y.employeeLeaveTypeStatisticsList">
                        {{ z.additionalLeave }}
                    </td>
                    <td ng-repeat="z in y.employeeLeaveTypeStatisticsList">
                        {{ z.lopLeave }}
                    </td>

               </tr>

请帮忙,在此先感谢:)

【问题讨论】:

  • 你的 JSON 在哪里?我只看到一个 JavaScript 对象。
  • 有什么问题?你给了我们 html 元素和你在 $scope 中的 json 那又怎样?
  • 它不是 JSON,它是一个 JavaScript 对象。 JSON 看起来不同。请检查我的答案。

标签: javascript angularjs json angularjs-ng-repeat


【解决方案1】:

好吧,虽然您没有提供足够的信息来创建完整的合格答案,但我试图以随机方式发布您的数据 - 这是runnable demo fiddle

查看

<div ng-controller="MyCtrl">
  <table border="1">
   <tbody ng-repeat="parent in LeavesStatastics.departMentLeaveStatisticss">
      <tr ng-repeat="item in parent.employeeStatisticss">
        <td>{{ item.empName }} </td>
        <td ng-repeat="z in item.employeeLeaveTypeStatisticsList">
          {{ z.maxLeave }}
        </td>
        <td ng-repeat="z in item.employeeLeaveTypeStatisticsList">
          {{ z.additionalLeave }}
        </td>
        <td ng-repeat="z in item.employeeLeaveTypeStatisticsList">
          {{ z.lopLeave }}
        </td>
      </tr>
  </table>
</div>

【讨论】:

  • @RakeshAdigoppula 看到您的链接,您已经正确地遍历了 js 对象。你到底想要什么?
  • @RakeshAdigoppula 请创建一个新问题,因为这已解决。不要忘记使用答案投票按钮附近的勾号来标记正确的答案。我会帮助您解决新问题。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2015-11-08
  • 2015-04-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多