2016-07-13 5 views
0

Lets sagen, ich habe dieses Objekt:UNIQUE Filter ng-repeat Angular. Blenden Sie die doppelten Werte in den Spalten nicht ganze Zeilen

$scope.men= [ 
    { 
    age: 21, 
    name: "John" 
    }, 
    { 
    age: 21, 
    name: "Daenerys" 
    }, 
    { 
    age: 21, 
    name: "Sansa" 
    } 
     { 
    age: 50, 
    name: "Cersei" 
    }, 
    { 
    age: 50, 
    name: "No one" 
    }, 
    { 
    age: 50, 
    name: "Gregor" 
    }]; 

Jetzt in der HTML-Ansicht ich eine Tabelle darstellen wollen, die wie folgt aussehen:

------------------- 
| age | name | 
------------------- 
| 21 | Jhon | 
------------------- 
|  | Daenerys| 
------------------- 
|  | Sansa | 
------------------- 
| 50 | Cersei | 
------------------- 
|  | Gregor | 
------------------- 

I versuchte UI-Angular, aber es hat nicht gut funktioniert. Ich brauche einen Filter wie 'einzigartig', aber mit ein wenig Modifikation.

EDIT: Mein Ziel ist es, die doppelten Werte in der Spalte "Alter" zu verstecken.

+0

Warum nicht einfach '$ scope.men' nach Alter gruppieren? –

+0

Mein Ziel ist es, die doppelten Werte in der Spalte 'Alter' zu verstecken oder ich habe nicht verstanden, was Sie meinen –

Antwort

4

Eine weitere einfache und unkomplizierte Lösung ist ein ternäres Kontrolle zu tun.

<body ng-controller="MainCtrl"> 
    <p>Hello {{name}}!</p> 
    <table> 
     <thead> 
     <tr> 
      <th>Age</th> 
      <th>name</th> 
     </tr> 
     </thead> 
     <tbody> 
     <tr ng-repeat="m in men | orderBy:'age'"> 
      <td>{{men[$index-1].age !== m.age ? m.age : ''}}</td> 
      <td>{{m.name}}</td> 
     </tr> 
     </tbody> 
    </table> 
    </body> 

Voll plnkr.

+2

Das bedeutet, dass Ihre Objekte immer nach Alter sortiert werden sollten, indem Sie '| orderBy: "Alter" zur 'ng-Wiederholung 'wäre besser. Btw, 'track by $ index' ist nicht notwendig, um' $ index' freizulegen. –

+1

@NexusDuck Ja, Sie haben Recht, es ist absolut notwendig, dass das Array nach Alter geordnet ist, damit diese Lösung funktioniert –

+0

Es ist nach Alter geordnet Ofc und es funktioniert gut für mich. Das ist die Idee, doppelte Werte untereinander nicht anzuzeigen, wenn sie natürlich sortiert sind und @PrinceJohn es genagelt hat. –

1

Sie können Ihre $ scope.men auf ein anderes Objekt (Gruppe nach Alter) ändern und dann verwenden ng-Repeater auf sie

var obj = {}; 

$scope.men.forEach(function(men) { 
     obj[men.age] = obj[men.age] || []; 
     obj[men.age].push(men); 
}); 

$scope.men = obj; 

Now you can use ng-repeat over $scope.men