使用更新日期对ng-repeat中的项目进行分组

时间:2017-05-05 10:49:43

标签: javascript angularjs ionic-framework

我想显示如下项目:

Nillable

我的代码是:

date:14 march 2016
 2042
 2000
date:15 march 2016
 1500
 1501
 1600

请帮我解决这个问题。我想显示按更新分组的项目  日期。  我得到的结果如下:

<div ng-repeat="(key, value) in oc.mileage_data | groupBy: 'updated_at' ">
    <div class="div_day" >
        <p>{{key * 1000 | date: 'd MMMM y' }}</p>
    </div>
    <ion-list can-swipe="listCanSwipe">
        <ion-item ng-repeat="mileage in value" class="" style="padding: 0px;">
            <div class="listing_div">
                <i class="icon-mileage milage_color"></i>
                <h2>{{mileage.mileage}}</h2>
                <span></span>

            </div>
            <ion-option-button class="button-positive button_delete" ng-click="share(item)">
                <i class="ion-ios-trash"></i> Delete
            </ion-option-button>
        </ion-item>
    </ion-list>
</div>

2 个答案:

答案 0 :(得分:0)

您可以创建多个ng-repeat并仅在数据与ng-if匹配时显示它们:if if:

//here only 2014
<div ng-repeat="item in data | groupBy: 'datetime' ">
<span ng-if="item.datetime.indexOf(2014) > -1">{{item.datetime }}</span>
</div>


//here only 2015
    <div ng-repeat="item in data | groupBy: 'datetime' ">
    <span ng-if="item.datetime.indexOf(2015) > -1"> {{item.datetime}}</span>
    </div>

//等...

答案 1 :(得分:0)

json数据:

var data = [
  {
    date: '14 march 2016',
    value: 1
  },
  {
    date: '14 march 2016',
    value: 2
  },{
    date: '15 march 2016',
    value: 3
  },
  {
    date: '15 march 2016',
    value: 4
  }
  ];

按日期分组:

$scope.uniq = [];
angular.forEach(data,function(val,index) {
  if(angular.isUndefined($scope.uniq[val['date']])){
     $scope.uniq[val['date']] = [val['value']];
  }else{
     $scope.uniq[val['date']].push(val['value']);
  } 
});

//输出:

['14 March 2016' : [1,2]........