Javascript 基于字符串数组的AngularJS过滤器？

我正绞尽脑汁思考如何去做一个角度滤波器来解决我遇到的问题

下面是我的数据结构的一个基本示例，一系列任务：

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"] }
];

因此，每个对象都有一个标记数组。为了举例说明，假设我将这些对象中的每一个输出为表中的一行

初始化pages ng控制器后，我将从所有任务中抓取所有标记（无重复项），并将它们组合成一个

标记

数组

然后，我将这些标签作为页面上可切换的按钮输出。默认情况下，所有按钮均为蓝色，表示“活动”（换句话说：显示包含此标记的任务）。我需要能够单击其中一个按钮来“关闭”该标记——这将过滤掉表中任务具有该标记的任何任务行

与视觉参考类似——grey=“隐藏其标记包含此标记的任务”，blue=“显示其标记包含此标记的任务”：

单击按钮会将其变为灰色，从而过滤掉表中具有该标记的所有任务。然后，我可以再次单击按钮以重新打开该标记，重新显示带有该标记的所有任务

我解释得够清楚吗？这是一个令人困惑的系统

无论如何，我尝试了以下方法：

ng filter=“filteredWithTags=（tasks | filter:{tags:arrayOfTags}中的任务”

无效

有人能给我指一下正确的方向吗？：）

PS:本周早些时候，我通过调用控制器中的

filterByTag（tag）

函数实现了这一点。这将遍历任务数组中的每个任务，如果它有匹配的标记，它将隐藏该任务。同样地，重新激活一个标签也会做同样的事情，在每个人中循环并发挥魔力。。。但有人告诉我，我的方法是慢+滥杀，因为“角度过滤器可以为您处理所有这些，这将是最好的实践”。因此，为什么我在这里，试图找出如何让Angular为我做这项工作：）

感谢您的帮助

您可以编写一个自定义。过滤器将被提供活动标签列表，

标签

，以及要过滤的任务数组，

任务

，并将输出过滤标签数组。它将与您已经完成的工作大致相同，但在作用域上没有额外的功能

angular.module('myApp').filter('selectedTags', function() {
    return function(tasks, tags) {
        return tasks.filter(function(task) {

            for (var i in task.Tags) {
                if (tags.indexOf(task.Tags[i]) != -1) {
                    return true;
                }
            }
            return false;

        });
    };
});

然后你可以像这样使用它

<ul>
    <li ng-repeat="task in tasks | selectedTags:tags"></li>
</ul>

---

查看此项。

涵盖该概念的可靠答案，但我认为，为了更准确地回答问题，将拒绝在界面中未选择的标记列表中包含标记的任何任务。与接受在界面中选择的标记列表中包含标记的任务相反。@Rich我不完全确定您的意思。你的意思是“标签列表”应该是被拒绝/停用的标签，而不是被接受/激活的标签吗？是的，这就是问题所要求的。引用“我需要能够单击其中一个按钮来“关闭”该标记——这将过滤掉表中任务有该标记的任何任务行。”我明白你的意思，但我认为这个问题在这一点上是不明确的默认情况下，所有按钮均为蓝色，表示“活动”（换句话说：显示包含此标记的任务）。“如果我没有遗漏任何内容，则不清楚任务是否需要激活其所有标记才能显示。我认为你是对的。重读一遍，问题中的语言本身是矛盾的，因此任何一种解释都是可能的。”与视觉参考类似——grey=“hide tasks whichs tags contain this tag”，blue=“show tasks whichs tags contain this tag”：“实际上，您的解释更符合常识。