GROUPBY

私はIND、TS、HYD
Miyapur GROUPBY

形式以下のように表示したい [{ "id": 1, "address": "MG Road", "country": INDIA, "state": AP, "city": VIJ }, { "id": 2, "address": "Miyapur", "country": INDIA, "state": TS, "city": HYD }, { "id": 3, "address": "Autonagar", "country": INDIA, "state": AP, "city": VIJ }, { "id": 4, "address": "Kukatpalli", "country": INDIA, "state": TS, "city": HYD }, { "id": 5, "address": "Koti", "country": INDIA, "state": TS, "city": HYD } ]

以下のように私は、JSONデータを持っていますKoti、Kukatpalli
IND、AP、VIJ、
MGロード、Autonagar

そのイムについてはGROUPBYは、以下のようなフィルタを使用したが、私はここで、これらの値

は私のコードは、私がいた

<div class="location-container"> <label ng-repeat="(key,value) in locationmodel | groupBy: '[country,state,city]'">{{key}} </label> <span ng-repeat="location in value">{{location.address}}</span> </div>

しかし、上記のコードであるグループにできませんでした私が期待しているものを得ることができません。これを解決する際に私を助けてください。事前

出典

2016-09-15 user2451830

で

おかげであなたが好きなら、あなたはここにあなたの出力

<!DOCTYPE html> 
<html> 
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> 
<script> 
    var myApp = angular.module('myApp', []); 
    myApp.controller('myAppCtrl', function ($scope) { 
    var locationmodel = [{ 
     "id" : 1, 
     "address" : "MG Road", 
     "country" : "INDIA", 
     "state" : "AP", 
     "city" : "VIJ" 
    }, { 
     "id" : 2, 
     "address" : "Miyapur", 
     "country" : "INDIA", 
     "state" : "TS", 
     "city" : "HYD" 
    }, { 
     "id" : 3, 
     "address" : "Autonagar", 
     "country" : "INDIA", 
     "state" : "AP", 
     "city" : "VIJ" 
    }, { 
     "id" : 4, 
     "address" : "Kukatpalli", 
     "country" : "INDIA", 
     "state" : "TS", 
     "city" : "HYD" 
    }, { 
     "id" : 5, 
     "address" : "Koti", 
     "country" : "INDIA", 
     "state" : "TS", 
     "city" : "HYD" 
    } 
    ]; 
    var resultObj = {}; 
    for (var i = 0; i < locationmodel.length; i++) { 
    if (resultObj[locationmodel[i].country + ',' + locationmodel[i].state + ',' + locationmodel[i].city]) 
     resultObj[locationmodel[i].country + ',' + locationmodel[i].state + ',' + locationmodel[i].city].address.push(locationmodel[i].address); 
    else 
     resultObj[locationmodel[i].country + ',' + locationmodel[i].state + ',' + locationmodel[i].city] = { 
     address : [locationmodel[i].address] 
     }; 
    } 

$scope.result=resultObj; 
    }); 
</script> 
<body ng-app="myApp" ng-controller='myAppCtrl'> 
<div class="location-container" ng-repeat="(key,value) in result"> 
    <label >{{key}}</label><br> 
    <span>{{value.address.join()}}</span> 
</div> 
</body>

出典

2016-09-15 07:22:15

完全に作業するには:)ありがとうございました – user2451830

を取得するには、このいずれかを試すことが解決策である。 https://jsfiddle.net/mqt0xjjc/

HTML：

<div ng-app="myApp"> 
<div ng-controller="Main"> 
    <div ng-repeat=" (groupedBy, groupedItems) in locationmodelGrouped"> 
     <b>{{groupedBy}}</b> 
     <li ng-repeat="item in groupedItems">{{item.address}}</li>   
    </div> 
</div> 
</div>

の

JS：

angular.module('myApp', []).controller('Main', 
function($scope) { 
    function groupBy(items, groupByAttrs) { 
     const retVal = items.reduce(
      function (sum, item) { 
      const key = groupByAttrs.map(attr => item[attr]).join(','); 
      sum[key] = sum[key] || []; 
      sum[key].push(item); 
      return sum; 
      }, 
      {} 
     ); 
     return retVal; 
    }; 

    $scope.$watch('locationmodel', 
     function() { 
     $scope.locationmodelGrouped = groupBy($scope.locationmodel, ['country','state','city']) 
     } 
    ) 

$scope.locationmodel = [{ 
    "id": 1, 
    "address": "MG Road", 
    "country": 'INDIA', 
    "state": 'AP', 
    "city": 'VIJ' 
}, 
{ 
    "id": 2, 
    "address": "Miyapur", 
    "country": 'INDIA', 
    "state": 'TS', 
    "city": 'HYD' 
}, 
{ 
    "id": 3, 
    "address": "Autonagar", 
    "country": 'INDIA', 
    "state": 'AP', 
    "city": 'VIJ' 
}, 
{ 
    "id": 4, 
    "address": "Kukatpalli", 
    "country": 'INDIA', 
    "state": 'TS', 
    "city": 'HYD' 
}, 
{ 
    "id": 5, 
    "address": "Koti", 
    "country": 'INDIA', 
    "state": 'TS', 
    "city": 'HYD' 
} 
]; 

});

出典

2016-09-15 07:45:19

答えて

関連する問題