Question

这对我来说有点困难，因为我仍然是角色的新手。我有

等数据

$scope.datas =[
    {name:'haha',datetime:'2015-06-06 09:24:34'},
    {name:'taha',datetime:'2015-07-06 19:10:45'},
    {name:'gaga',datetime:'2015-06-06 15:36:14'},
    {name:'lala',datetime:'2015-07-06 04:43:24'}
]

然后我想在ng-repeat中执行此操作，但希望将结果生成为

<table>

<tr><td colspan="2">2015-06-06</td></tr>
<tr><td>09:24:34</td><td>haha</td></tr>
<tr><td>15:36:14</td><td>gaga</td></tr>

<tr><td colspan="2">2015-07-06</td></tr>
<tr><td>19:10:45</td><td>taha</td></tr>
<tr><td>04:43:24</td><td>lala</td></tr>

</table>

怎么能实现这个目标？

Answer 1

您必须首先拆分日期和时间字段，然后必须绑定要显示在所需列中的数据，您可以使用ng-modle执行此操作或使用双花括号显示数据＆＃ 34; {{data field}}＆＃34; databinding link

Answer 2

Aight，花了一些时间在这上面，并认为我有适合你的东西。

如上所述，您需要在控制器中分割日期和时间，这不应该太难。您的数据应如此。

$scope.datas =[
    {name:'haha',date:'2015-06-06', time: '09:24:34'},
    {name:'taha',date:'2015-07-06', time: '19:10:45'},
    {name:'gaga',date:'2015-06-06', time: '15:36:14'},
    {name:'lala',date:'2015-07-06', time: '04:43:24'}
];

然后，您的标记应如下所示：

<table>
    <tr ng-repeat-start="(key, value) in datas | groupBy : 'date'"><td colspan="2">{{key}}</td></tr>
    <tr ng-repeat-end ng-repeat="time in value">
        <td>{{time.time}}</td><td>{{time.name}}</td>
    </tr>
</table>

两个关键因素：您需要下载阵列过滤器模块：

npm install array-filter

并将其添加到标记脚本依赖项中。

另一个是您正在使用ng-repeat-start和ng-repeat-end标记，这些标记允许您重复父元素而不是多个元素。因为你的结尾元素也是一个ng-repeat元素，我建议测试更大的数据集，但我测试了它，它创建了你想要的。

ng-repeat中的角度组数据

2 个答案: