我正在尝试将模型中的数据插入模板,但是我想每7次重复添加一个新的表行。使用基于strign的模板,我可以使用迭代索引和模来相当容易地做到这一点,但是我无法弄清楚如何使用angular的DOM模板来做到这一点。
这是HTML:
<div ng-controller="MyCtrl"> <table cellspacing="0" cellpadding="0"> <colgroup span="7"></colgroup> <tbody> <tr class="days"> <th scope="col" title="Monday">Mon</th> <th scope="col" title="Tuesday">Tue</th> <th scope="col" title="Wednesday">Wed</th> <th scope="col" title="Thursday">Thu</th> <th scope="col" title="Friday">Fri</th> <th scope="col" title="Saturday">Sat</th> <th scope="col" title="Sunday">Sun</th> </tr> <tr> <td ng-repeat="date in dates"> {{ date }} <!-- After seven iterations a new `<tr>` should be aded --> </td> </tr> </tbody> </table> </div>
而javascript类似于:
myApp = this.angular.module('myApp', []); var monthDays = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 1516, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31]; myApp.controller('MyCtrl', function($scope) { return $scope.dates = monthDays; });
您可以在JSFiddle中查看以下代码:http : //jsfiddle.net/3zhbB/2/
请$scope.dates与天数组的数组。
$scope.dates
其中的每个数组都是一行,而该行数组中的每一天都是一天
请参阅此更新的JSFiddle http://jsfiddle.net/6aqtj/1/