在angularjs中按行逐行顯示ng-repeat值的總和

Question

我是angularjs的新手，並試圖使用ng-repeat填充值（整數值）的表，使用輸入變量正確填充表中的值id = v1，但我無法將行的總和放在表格的最後一列中的標籤上，請幫助/指導。

HTML代碼：

<tbody> 
<tr ng-controller="Dataload" ng-model="orderProp" ng-repeat="(key, value) in Dataloads | groupBy:'project'"> 
<td> 
<label id="projectname" name="projectname" readonly style="width:300px">{{key}}</label> 
</td> 
<td ng-repeat="Dataload in value | orderBy:'date':false "> 
<div> 
<select ID="DropDownList1" Width="8%" Height="28px">                   
<option value="pending">&#9994;</option> 
<option value="accept">&#9989;</option> 
<option value="reject">&#10060;</option> 
</select> 
<input type="text" id="v1" name="" class="form-control" readonly="readonly" data-ng-model="Dataload.qty" required /> 
</div> 
</td> 
<td> 
<label style="width:90px" name="total" id="total" >**want to show sum of row in this label**</label> 
</td> 

</tr> 
</tbody> 

控制器代碼：

'use strict'; 
var app = angular.module("GMAO3App"); 
app.controller('Dataload', Dataload); 
Dataload.$inject = ['$scope', '$rootScope', '$http', 'ngAuthSettings']; 
function Dataload($scope, $rootScope, $http, ngAuthSettings) { 

    var serviceBase = ngAuthSettings.apiServiceBaseUri; 
    $http.get(ngAuthSettings.apiServiceBaseUri + 'web/partes/Dataload?worker=233&society=1&branch=0&start=2017-05-29&end=2017-06-04'). 
     success(function (data, status, headers, config) { 
      $scope.Dataloads = data; 
      var Data_project = []; 
      var Data1_qty = []; 
      var Data2_date = []; 
      for (var i = 0; i <= $scope.Dataloads.length; i++) { 
       Data_project[i] = $scope.Dataloads[i].project; 
       Data1_qty[i] = $scope.Dataloads[i].qty; 
       Data2_date[i] = $scope.Dataloads[i].date; 
      } 

     }). 
     error(function (data, status, headers, config) { 
      alert("error"); 
     }); 

}; 

示範圖片： Image contains the UI and sample data for example (1,6,1 2,3), i want to add these values and add their sum to last column of row

Answer 1

<label style="width:90px" name="total" id="total" >{{value | map:'qty' | sum}} 
</label> 

這解決了我的問題。感謝@Jenny

Answer 2

您可以訪問DataLoads lentgh來獲取顯示在最後的行數，在ng-repeat之外。

<td> 
    <label style="width:90px" name="total" id="total">{{DataLoads.length}}</label> 
</td> 

EDITED

試試這樣說：

<table> 
    <tbody> 
     <tr ng-controller="Dataload" ng-model="orderProp" ng-repeat="(key, value) in Dataloads | groupBy:'project'"> 
      <td> 
       <label id="projectname" name="projectname" readonly style="width:300px">{{key}}</label> 
      </td> 
      <td ng-repeat="Dataload in value | orderBy:'date':false" ng-init="items.total = {}"> 
      <div> 
       <select ID="DropDownList1" Width="8%" Height="28px">                   
        <option value="pending">&#9994;</option> 
        <option value="accept">&#9989;</option> 
        <option value="reject">&#10060;</option> 
       </select> 
       <input type="text" id="v1" name="" class="form-control" readonly="readonly" data-ng-model="Dataload.qty" ng-init="items.total.qty = items.total.qty + Dataload.qty" required /> 
      </div> 
      </td> 
      <td> 
       <label style="width:90px" name="total" id="total" >{{items.total.qty}}</label> 
      </td> 

     </tr> 
    </tbody> 
    <table>