AngularJS фильтр на основе массива строк?
Мне трудно думать о том, как сделать фильтр Angular, чтобы решить проблему, с которой я сталкиваюсь.
Вот базовый пример моей структуры данных, массив задач:
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"] }
];
Таким образом, каждый объект имеет массив тегов. Для примера, скажем, я вывожу каждый из этих объектов в виде строки в таблице.
Как только страницы нг-контроллера инициализированы, язахватить все теги из всех задач (без дубликатов) и собирать их вtags
массив.
Затем я выводю эти теги как переключаемые кнопки на странице. Все кнопки по умолчанию синие, что означает «активный» (другими словами: показать задачи с этим тегом). Мне нужно иметь возможность нажимать на одну из этих кнопок, чтобы «отключить» этот тег - который отфильтрует все строки задач в таблице, где у задачи есть этот тег.
Как и для визуальной справки - grey = "скрыть задачи, теги которых содержат этот тег", blue = "показать задачи, теги которых содержат этот тег":
.
При нажатии на кнопку она становится серой, отфильтровывая любые задачи в таблице, которые имеют этот тег. Затем я могу снова нажать кнопки, чтобы снова включить этот тег, повторно отображая все задачи с этим тегом.
Я объясняю это достаточно ясно? Это запутанная система.
Во всяком случае, я попробовал следующее:
ng-filter="task in filteredWithTags = (tasks | filter: { tags: arrayOfTags }"
но безрезультатно.
Кто-то разум направляет меня в правильном направлении? :)
PS: У меня было это работает в начале этой недели, позвонивfilterByTag(tag)
функция в моем контроллере. Это зациклило бы каждую задачу в массиве задач, и если бы у нее был соответствующий тег, она бы скрыла эту задачу. так жеПовторная активация тег будет делать то же самое, проходить через всех и творить чудеса ... но мне сказали, что мой метод был медленным + избыточный, потому что "угловые фильтры могут справиться со всем этим для вас, и это будет лучше practicy». Следовательно, почему я здесь, пытаюсь выяснить, как позволить Angular сделать работу за меня :)
Любая помощь приветствуется!