我正在尝试获取 My ng-repeat 表中一列的总和。我分享了本段下方表格的图片。
表的代码如下。
<table>
<tr>
<th>Ref No</th><th>Model</th><th>IMEI</th><th>Color</th><th>Warranty</th><th>Branch</th><th>Party</th><th>Date of Sell</th><th>Amount</th>
</tr>
<tr ng-repeat="x in Approve"><td> {{ x.sno }} </td><td> {{ x.p_model }} </td><td> {{ x.imei }} </td><td> {{ x.color }} </td><td> {{ x.warrenty }} </td><td> {{ x.branch }} </td><td> {{ x.party }} </td><td> {{ x.dsell }} </td><td ng-init="Approve.total.amount = Approve.total.amount + x.rate"> {{ x.amount | number:2 }} </td></tr>
<tr><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td style="color:red;">Grand Total</td><td>{{ grandtotal }}</td></tr>
</table>
我的 Controller 代码如下。
<script>
var app = angular.module('myApp', []);
app.controller('customersCtrl', function($scope, $http) {
$http.get("api/sold_out.php").then(function (response) {
$scope.Approve = response.data.message;
});
});
</script>
从服务器获取json:
{"message":[{"0":"2","sno":"2","1":"Huawei P9 Lite ","p_model":"Huawei P9 Lite ","2":"545454545454","imei":"545454545454","3":"White","color":"White","4":"CGC","warrenty":"CGC","5":"50","amount":"50","6":"1","sell":"1","7":"27\/02\/2017","dsell":"27\/02\/2017","8":"1","transfer":"1","9":"MANSOURA","branch":"MANSOURA","10":"Cloud International Co Will","party":"Cloud International Co Will"},{"0":"3","sno":"3","1":"Samsung Galaxy J7 6","p_model":"Samsung Galaxy J7 6","2":"456545454545545","imei":"456545454545545","3":"Gold","color":"Gold","4":"Gasham","warrenty":"Gasham","5":"100","amount":"100","6":"1","sell":"1","7":"27\/02\/2017","dsell":"27\/02\/2017","8":"1","transfer":"1","9":"MANSOURA","branch":"MANSOURA","10":"Cloud International Co Will","party":"Cloud International Co Will"}]}
我需要在Grand Total区域显示Amount列的合计sum值。
最佳答案
正如我在评论中所说,解决此问题的一种方法是使用如下所示的自定义过滤器:
(function() {
'use strict';
angular
.module('Test', [])
.filter('sumByColumn', function () {
return function (collection, column) {
var total = 0;
collection.forEach(function (item) {
total += parseInt(item[column]);
});
return total;
};
});
})();
然后您可以通过指定要对哪一列求和来调用您的集合的过滤器:
<td>{{ Approve | sumByColumn: 'amount' }}</td>
恕我直言,在这里使用过滤器的优点是它可以重复使用。每当您需要对任何数据的特定列求和时,您可以再次使用此过滤器来完成。
当然,我建议您通过检查列值是否为数字来改进它,例如...等...因为它是一个过滤器,您可以轻松地为其编写测试。
我创建了一个 JsFiddle 以演示它如何在您的上下文中工作 https://jsfiddle.net/7b3q2q5p/4/
关于angularjs - 如何在ng-repeat中获取列的总和,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42489473/