Question

我有一系列对象，包括数量和日期，如下所示

NetworkFile

我正在日期上应用 groupBy ，如下所示，

$scope.items = [
  {
    "date": "2017-05-18T00:00:00.000Z",
    "quantity": 50,
    "id": 5
  },
  {
    "date": "2017-05-18T00:00:00.000Z",
    "quantity": 6,
    "id": 7
  },
  {
    "date": "2017-05-19T00:00:00.000Z",
    "quantity": 50,
    "id": 11
  },
  {
    "date": "2017-05-19T00:00:00.000Z",
    "quantity": 10,
    "id": 30
  },
  {
    "date": "2017-05-19T00:00:00.000Z",
    "quantity": 10,
    "id": 31
  }
];

在这里，我如何添加按对象分组和显示的数量。例如， 18-may-2017 的总数量将是50 + 6 = 56。

Answer 1

见：

var MyApp = angular.module("MyApp",['angular.filter']);
MyApp.controller("MyCtrl",['$scope',MyCtrl]);
function MyCtrl($scope) {
$scope.items = [
  {
    "date": "2017-05-18T00:00:00.000Z",
    "quantity": 50,
    "id": 5
  },
  {
    "date": "2017-05-18T00:00:00.000Z",
    "quantity": 6,
    "id": 7
  },
  {
    "date": "2017-05-19T00:00:00.000Z",
    "quantity": 50,
    "id": 11
  },
  {
    "date": "2017-05-19T00:00:00.000Z",
    "quantity": 10,
    "id": 30
  },
  {
    "date": "2017-05-19T00:00:00.000Z",
    "quantity": 10,
    "id": 31
  }
];
  
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.22/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-filter/0.5.16/angular-filter.js"></script>
<div ng-app="MyApp" ng-controller="MyCtrl">
<div class="row" ng-repeat="log in items | groupBy: 'date'">
        <div class="col-md-12">
            <table>
                <thead>
                    <tr>
                        <th>Date</th>
                        <th>Quantity</th>
                        <th>Total Quantity</th>
                    </tr>
                </thead>
                <tbody>
                    <tr ng-repeat="item in log">
                    
                        <td>{{item.date | date : 'dd-MMM-yyyy'}}</td>
                        <td>{{item.quantity}}</td>
                        <td>{{log | map : 'quantity' | sum }}</td>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>
    </div>

Answer 2

<强>样本

＆＃13;

var app = angular.module("myApp", ['angular.filter']);
app.controller("SimpleController", function($scope) {
  $scope.items = [
  {
    "date": "2017-05-18T00:00:00.000Z",
    "quantity": 50,
    "id": 5
  },
  {
    "date": "2017-05-18T00:00:00.000Z",
    "quantity": 6,
    "id": 7
  },
  {
    "date": "2017-05-19T00:00:00.000Z",
    "quantity": 50,
    "id": 11
  },
  {
    "date": "2017-05-19T00:00:00.000Z",
    "quantity": 10,
    "id": 30
  },
  {
    "date": "2017-05-19T00:00:00.000Z",
    "quantity": 10,
    "id": 31
  }];
  
  $scope.calculatetotal = function(arrayGrouped){
       var total = 0;
       arrayGrouped.forEach(function(key,value){
              total+=key.quantity;
       });
       return total;
  }
});

＆＃13;

<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-filter/0.5.16/angular-filter.js" > </script>
<body ng-app="myApp">
    <div>
        <div data-ng-controller="SimpleController">
          <div class="row" ng-repeat="log in items | groupBy: 'date'">
        <div class="col-md-12">
            <table>
                <thead>
                    <tr>
                        <th>Date</th>
                        <th>Quantity</th>
                    </tr>
                </thead>
                <tbody>
                    <tr ng-repeat="item in log">
                        <td>{{item.date | date : 'dd-MMM-yyyy'}}</td>
                        <td>{{calculatetotal(log)}}</td>
                        <td>total of quantity</td>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>
        </div>
    </div>
</body>

</html>

＆＃13;

如何在AngularJS中按数据添加组？

2 个答案: