2017-03-17 63 views
0

ng-repeat我有一個相同的但不同 & 類別angularjs ngrepet相同的數據合併

我的問題是,如果當月不應該環路月<td></td>

<table> 
    <tbody> 
    <tr ng-repeat="data in myCtrl.value"> 
     <td class="text-center">{{data.month}}</td> 
     <td class="text-center">{{data.amountval}}</td> 
     <td class="text-center">{{data.categoryval}}</td> 
    </tr> 
    </tbody> 
</table> 
+0

問題不明確,如果一個月是相同的? –

+0

請檢查我的更新問題 – Develop

+0

您是否想要將該行摺疊一個月? – amansinghgusain

回答

0

您可以組個月的數據和表格應用行跨度。

var app = angular.module('app', []); 
 

 
app.controller('MainCtrl', function($scope) { 
 
    $scope.finalLoopData = {}; 
 
    $scope.loopData = [{month:'Jan',amountval:'30',categoryval:'50'}, 
 
    {month:'Jan',amountval:'30',categoryval:'50'}, 
 
    {month:'Jan',amountval:'30',categoryval:'50'}, 
 
    {month:'Jan',amountval:'30',categoryval:'50'}, 
 
    {month:'Feb',amountval:'30',categoryval:'50'}, 
 
    {month:'Feb',amountval:'30',categoryval:'50'}, 
 
    {month:'Feb',amountval:'30',categoryval:'50'}, 
 
    {month:'Feb',amountval:'30',categoryval:'50'} 
 
    ]; 
 
    
 
    $scope.arrayToObject = function() { 
 
      var finalLoopData = {}; 
 
      angular.forEach($scope.loopData, function (value, key) { 
 
       if (!finalLoopData[value.month]) { 
 
        finalLoopData[value.month] = new Array(); 
 
       } 
 
       finalLoopData[value.month].push(value); 
 
      }); 
 
      $scope.finalLoopData = finalLoopData; 
 
     } 
 
     $scope.arrayToObject(); 
 
});
<!DOCTYPE html> 
 
<html ng-app="app"> 
 

 
    <head> 
 
    <meta charset="utf-8" /> 
 
    <title>AngularJS Plunker</title> 
 
    <script>document.write('<base href="' + document.location + '" />');</script> 
 
    <link rel="stylesheet" href="style.css" /> 
 
    <script data-require="[email protected]" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.10/angular.min.js" data-semver="1.5.10"></script> 
 
    <script src="app.js"></script> 
 
    </head> 
 

 
    <body ng-controller="MainCtrl"> 
 
    <table> 
 
    <tbody ng-repeat="monthGroup in finalLoopData"> 
 
    <tr ng-repeat="loopData in monthGroup"> 
 
     <td class="text-center" rowspan="{{monthGroup.length}}" ng-if="$index===0">{{loopData.month}}</td> 
 
     <td class="text-center">{{loopData.amountval}}</td> 
 
     <td class="text-center">{{loopData.categoryval}}</td> 
 
    </tr> 
 
    </tbody> 
 
</table> 
 
    </body> 
 

 
</html>

+0

Rowsapn不工作 – Develop

+0

您是否運行此代碼段? – amansinghgusain

+0

雅我在我的代碼問 – Develop