Sortieren mehrdimensionale JSON in Winkel

Question

ich JSON aus einer Datenbank und seine Struktur ist wie folgt:

"data": [ 
    { 
     "category": "1", 
     "description": "hello" 
     } 
    ] 

description und category sind dynamisch, so kann ich 5 Objekte mit category:1 und 2 mit category:3 etc. Oder Ich könnte 3 Objekte mit category:20 und 25 Objekte mit category:8 haben.

Ich möchte HTML-Elemente wie folgt erstellen:

Category 1 
.... 
.... 
.... 

Category 3 
.... 
.... 

ich eine Zeichenfolge wie folgt erstellen:

$scope.hello = []; 
angular.forEach(data.data, function(value, key) { 
    $scope.hello.push(value.category+" "+value.description) 
} 

so dass es folgende Ausgabe:

Category 1 hello 
Category 1 hi 
Category 1 bye 
Category 3 sup 
Category 3 yo 

Aber wie wende ich dies an:

Category 1 
hello 
hi 
bye 

Category 3 
sup 
yo 

Answer 1

Verwenden Sie groupby angular.filter Modul für weitere Informationen finden Sie in dieser Antwort. How can I group data with an Angular filter?

var app = angular.module("app",['angular.filter']) 
 
app.controller('ctrl',['$scope', function($scope){ 
 
     $scope.data = [ 
 
       { 
 
        "category": "1", 
 
        "description": "hello" 
 
       }, 
 
      { 
 
        "category": "1", 
 
        "description": "hi" 
 
       }, 
 
      { 
 
        "category": "3", 
 
        "description": "hai" 
 
       }, 
 
      { 
 
        "category": "1", 
 
        "description": "hello" 
 
       }, 
 
      { 
 
        "category": "3", 
 
        "description": "hello" 
 
       }, 
 
      { 
 
        "category": "1", 
 
        "description": "hai" 
 
       } 
 
    ] 
 
}]);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.22/angular.min.js"></script> 
 
<script src="//cdnjs.cloudflare.com/ajax/libs/angular-filter/0.4.7/angular-filter.js"></script> 
 
<div ng-app="app" ng-controller="ctrl"> 
 
<div class="item item-checkbox"> 
 
    <ul ng-repeat="(key, value) in data | groupBy: 'category'"> 
 
     category: {{ key }} 
 
     <li ng-repeat="d in value |orderBy:'description'"> 
 
      {{ d.description }} 
 
     </li> 
 
    </ul>  
 
</div>

Answer 2

Javascript bietet eine sort Funktion. In dieser Funktion sortiere ich ein Array von Site-Objekten nach zwei Eigenschaften. Name und Region.

function sort(col, direction) { 
     switch (col) { 
      case "region": 
      { 
       sites.sort(function(s1, s2) { 
        var r = 0; 
        if (s1.region < s2.region) 
         r = -1; 
        else if (s1.region > s2.region) 
         r = 1; 
        else { 
         if (s1.name < s2.name) 
          r = -1; 
         else if (s1.name > s2.name) 
          r = 1; 
        } 
        return r; 
       }); 
       break; 
      } 
      default: 
      { 
       sites.sort(function(s1, s2) { 
        var r = 0; 
        if (s1.name < s2.name) 
         r = -1; 
        else if (s1.name > s2.name) 
         r = 1; 
        else { 
         if (s1.region < s2.region) 
          r = -1; 
         else if (s1.region > s2.region) 
          r = 1; 
        } 
        return r; 
       }); 
      } 
     } 
     if (direction === "desc") { 
      this.sites.reverse(); 
     } 
    }