我正在嘗試使用條件將項目分組為ng-repeat。一個示例條件是將所有元素分組為同一小時。數據：[ {name: 'AAA', time: '12:05'}, {name: 'BBB', time: '12:10'}, {name: 'CCC', time: '13:20'}, {name: 'DDD', time: '13:30'}, {name: 'EEE', time: '13:40'}, ...]“時間”字段實際上是一個時間戳記（1399372207），但是使用準確的時間，示例輸出將更易于理解。我正在使用ng-repeat列出這些項目：<div ng-repeat="r in data| orderBy:sort:direction"> <p>{{r.name}}</p></div>還嘗試了：<div ng-repeat-start="r in data| orderBy:sort:direction"></div> <p>{{r.name}}</p><div ng-repeat-end></div>有效輸出為：<div class="group-class"> <div><p>AAA</p></div> <div><p>BBB</p></div></div><div class="group-class"> <div><p>CCC</p></div> <div><p>DDD</p></div> <div><p>EEE</p></div></div>如果沒有針對我的問題的簡單解決方案，我的最后一個選擇是將數據分組，然后將其分配給ng-repeat中使用的作用域變量。有什么想法嗎？
3 回答
一只斗牛犬
TA貢獻1784條經驗 獲得超2個贊
首先在控制器中建立組：
$scope.getGroups = function () {
var groupArray = [];
angular.forEach($scope.data, function (item, idx) {
if (groupArray.indexOf(parseInt(item.time)) == -1) {
groupArray.push(parseInt(item.time));
}
});
return groupArray.sort();
};
然后為其過濾：
myApp.filter('groupby', function(){
return function(items,group){
return items.filter(function(element, index, array) {
return parseInt(element.time)==group;
});
}
}) ;
然后更改模板：
<div ng-repeat='group in getGroups()'>
<div ng-repeat="r in data | groupby:group" class="group-class">
<div><p>{{r.name}}</p></div>
</div>
</div>
查看演示
- 3 回答
- 0 關注
- 668 瀏覽
添加回答
舉報
0/150
提交
取消