AngularJS Group Nach Richtlinie ohne externe Abhängigkeiten

Ich bin neu in Angular und würde gerne lernen, wie man mit einem Problem am besten umgeht. Mein Ziel ist es, ein wiederverwendbares Mittel zu haben, um Gruppen nach Kopfzeilen zu erstellen. Ich habe eine Lösung erstellt, die funktioniert, aber ich denke, dies sollte eine Direktive anstelle einer Bereichsfunktion in meinem Controller sein, aber ich bin nicht sicher, wie ich das erreichen soll, oder ob eine Direktive sogar der richtige Weg ist. Irgendwelche Eingaben wären sehr dankbar.

Sehen Sie sich meinen aktuellen Ansatz anjsFiddle

Im HTML ist es eine einfache Liste mit ng-repeat, in der ich meine Funktion newGrouping () auf ng-show aufrufe. Die Funktion übergibt einen Verweis auf die vollständige Liste, das Feld, nach dem ich gruppieren möchte, und den aktuellen Index.

<div ng-app>
<div ng-controller='TestGroupingCtlr'>
    <div ng-repeat='item in MyList'>
        <div ng-show="newGrouping($parent.MyList, 'GroupByFieldName', $index);">
            <h2>{{item.GroupByFieldName}}</h2>
        </div>
        {{item.whatever}}
    </div>
</div>
</div>

In meinem Controller habe ich meine newGrouping () -Funktion, die einfach die aktuelle mit der vorherigen vergleicht, mit Ausnahme des ersten Elements, und je nach Übereinstimmung true oder false zurückgibt.

function TestGroupingCtlr($scope) {

  $scope.MyList = [
    {GroupByFieldName:'Group 1', whatever:'abc'},
    {GroupByFieldName:'Group 1', whatever:'def'},
    {GroupByFieldName:'Group 2', whatever:'ghi'},
    {GroupByFieldName:'Group 2', whatever:'jkl'},
    {GroupByFieldName:'Group 2', whatever:'mno'}
  ];

  $scope.newGrouping = function(group_list, group_by, index) {
  if (index > 0) {
    prev = index - 1;
    if (group_list[prev][group_by] !== group_list[index][group_by]) {
      return true;
    } else {
      return false;
    }
  } else {
    return true;
  }
  };
}

Die Ausgabe sieht dann so aus.

Gruppe 1

ABCdef

Gruppe 2

ghijklmno

Es fühlt sich an, als gäbe es einen besseren Weg. Ich möchte, dass dies eine allgemeine Dienstprogrammfunktion ist, die ich wiederverwenden kann. Sollte dies eine Richtlinie sein? Gibt es eine bessere Möglichkeit, auf das vorherige Element in der Liste zu verweisen, als meine Methode zum Übergeben der vollständigen Liste und des aktuellen Index? Wie würde ich mich dazu einer Richtlinie nähern?

Jeder Rat wird sehr geschätzt.

UPDATE: Auf der Suche nach einer Antwort, die keine externen Abhängigkeiten erfordert. Es gibt gute Lösungen, die Unterstreichung / Hinterlegung oder das Winkelfiltermodul verwenden.

Darryl

Antworten auf die Frage(9)

Ihre Antwort auf die Frage