Es fällt mir schwer, mich mit einem Winkelfilter zu beschäftigen, um ein Problem zu lösen, auf das ich stoße.

Hier ist ein grundlegendes Beispiel für meine Datenstruktur, eine Reihe von Aufgaben:

var tasks = [
    { Title: "This is a task title",
      Tags: ["Test","Tag","One","Two","Three"] },
    { Title: "Another test tag title",
      Tags: ["Some", "More", "Tags"] },
    { Title: "One more, why not",
      Tags: ["I","Like","Dirt"] },
    { Title: "Last one!",
      Tags: ["You","Like","Dirt"] }
];

Jedes Objekt hat also ein Array von Tags. Nehmen wir zum Beispiel an, ich gebe jedes dieser Objekte als Zeile in einer Tabelle aus.

Sobald der Pages ng-Controller initialisiert ist, bin ichAlle Tags von allen Aufgaben abrufen (ohne Duplikate) und Zusammenfügen zu einemtags Array.

Dann gebe ich diese Tags als umschaltbare Schaltflächen auf der Seite aus. Alle Schaltflächen sind standardmäßig blau und bedeuten "aktiv" (mit anderen Worten: Aufgaben mit diesem Tag anzeigen). Ich muss in der Lage sein, auf eine dieser Schaltflächen zu klicken, um dieses Tag "auszuschalten". Dadurch werden alle Aufgabenzeilen in der Tabelle herausgefiltert, in der die Aufgabe dieses Tag hat.

Als visuelle Referenz - grau = "Aufgaben ausblenden, deren Tags diesen Tag enthalten", blau = "Aufgaben anzeigen, deren Tags diesen Tag enthalten":

.

Wenn Sie auf eine Schaltfläche klicken, wird diese grau und alle Aufgaben in der Tabelle mit diesem Tag werden herausgefiltert. Ich kann dann erneut auf die Schaltflächen klicken, um dieses Tag wieder einzuschalten und alle Aufgaben mit diesem Tag wieder anzuzeigen.

Erkläre ich das klar genug? Es ist ein verwirrendes System.

Jedenfalls habe ich Folgendes versucht:

ng-filter="task in filteredWithTags = (tasks | filter: { tags: arrayOfTags }" umsonst.

Hat jemand etwas dagegen, mich in die richtige Richtung zu weisen? :)

PS: Ich hatte diese Arbeit Anfang dieser Woche mit einem Anruf bei einemfilterByTag(tag) Funktion in meinem Controller. Dies würde eine Schleife durch jede Aufgabe in dem Array von Aufgaben führen, und wenn es das passende Tag hätte, würde es diese Aufgabe verbergen. Ähnlicherneut aktivieren Ein Tag würde das Gleiche tun, jeden durchlaufen und die Magie wirken ... aber mir wurde gesagt, dass meine Methode langsam + übertrieben war, weil "Winkelfilter das alles für Sie handhaben können, und es wird besser sein - praktisch ". Also, warum bin ich hier und versuche herauszufinden, wie Angular die Arbeit für mich erledigen kann :)

Jede Hilfe wird geschätzt!