AngularJs

Question

通过 AngularJS (ng-repeat)，我会在 html table.

的 td 上使用列表列表

控制器中的数据：

$scope.schedules = [{plage:'8-12'},{plage:'14-18'},{plage:'19-23'}];
$scope.days = [{day:'Monday',schedules:$scope.schedules},{day:'Tuesday',schedules:$scope.schedules},{day:'Wednesday',schedules:$scope.schedules},{day:'Thursday',schedules:$scope.schedules},{day:'Friday',schedules:$scope.schedules}];

我想要 2 行（第一行 = 天数，第二行 = 时间表）：

<table>
  <tr>
    <td>Days:</td>
    <td colspan="3">Monday</td>
    <td colspan="3">Tuesday</td>
    <td colspan="3">Wednesday</td>
    <td colspan="3">Thursday</td>
    <td colspan="3">Friday</td>
  </tr>
  <tr>
    <td class="week">Schedules:</td>
    <td>8-12</td><td>14-18</td><td>19-23</td>
    <td>8-12</td><td>14-18</td><td>19-23</td>
    <td>8-12</td><td>14-18</td><td>19-23</td>
    <td>8-12</td><td>14-18</td><td>19-23</td>
    <td>8-12</td><td>14-18</td><td>19-23</td>
  </tr>
</table>

在HTML:

<table>
    <tr>
        <td>Days:</td>
        <td ng-repeat="businessWeekDay in days" colspan="3">{{businessWeekDay.day}}</td>
    </tr>
    <tr>
        <td>Schedule:</td>
        <!-- "businessWeekDay in days" -->
        <!-- "schedule in businessWeekDay.schedules"-->
        <td ng-repeat="?????????????">{{schedule.plage}}</td>
    </tr>
</table>

Answer 1

展平时间表，并使用单个 ng-repeat：

var allSchedules = [];
$scope.days.forEach(function(day) {
    Array.prototype.push.apply(allSchedules, day.schedules);
});

并且在视图中：

<td ng-repeat="schedule in allSchedules">{{ schedule.plage }}</td>

AngularJs - table 的 td 中的 ng-repeat 集合

AngularJs - ng-repeat collection of collection in td of table

arrays

ng-repeat

angularjs-ng-repeat