角6多场滤波器

Question

我目前工作的角度6应用程序。我有一个庞大的文章清单，并希望对其进行一些过滤。现在它工作的实时，没有按钮提交您的过滤器选项，这一切都发生在您键入。我想出了一个办法，但它仍然有一些问题，我可以解决，但不喜欢我这样做。我敢肯定，一定有更优雅的东西。

为了更好的想象，这些文章有类别，标题，作者，标签。我可以根据类别过滤它们，比如说.但我想做些过滤。

例如:过滤“体育”类别中的所有文章，然后从已经过滤的数组中过滤标题中有子字符串“目标”的所有文章，然后过滤那些作者是“john”的文章，然后用标签“曲棍球”过滤所有文章。

最后，我得到了大量的IF声明，这不是我想说的正确方法。你能给我推荐一些更好的方法吗？

Answer 1

这就是在没有多个if语句的情况下创建多过滤器的方法。

第一步:创建一个执行各种比较功能的对象：

let compareFunctions = {
    equal: function(a,b) {
        return a === b;
    },
    in: function(a,b){
        return a.indexOf(b) !== -1
    }
}

第二步:创建一个具有以下参数的函数：

1. 键-要过滤的记录字段的键。
2. 值-要通过以下方法筛选的值
3. compareFn -用于此字段的比较函数

此函数返回一个执行条件的函数。

function condition(key, value, comparFn = compareFunctions.equal) {
    return function(data) {
        return comparFn(data[key],value);
    }
}

第三步:创建一个包含“条件”函数的数组，该函数表示筛选器值：

let filterArray = [
    condition('category', 'sports'),
    condition('title', 'goal', compareFunctions.in),
    condition('author', 'john'),
    condition('tags', 'hokey', compareFunctions.in),
]

第四步:通过为每个条目调用条件函数数组并评估每个条件的结果来过滤记录：

let result = dataset.filter(y => {
    let resolved = filterArray.map(x => x(y))
    return resolved.every(x => x === true);
})

完整示例代码：

let compareFunctions = {
    equal: function(a,b) {
        return a === b;
    },
    in: function(a,b){
        return a.indexOf(b) !== -1
    }
}

function condition(key, value, comparFn = compareFunctions.equal) {
    return function(data) {
        return comparFn(data[key],value);
    }
}

let dataset = [
    {
        category: "sports",
        title: "goal goal goal",
        author: "john",
        tags: ["hokey", "ice-hokey"]
    },
    {
        category: "news",
        title: "bla bla",
        author: "Timo",
        tags: ["news"]
    },
    {
        category: "news",
        title: "blub blub",
        author: "alex",
        tags: ["hokey", "ice-hokey"]
    },
    {
        category: "sports",
        title: "Kölner Haie bla bla",
        author: "Timo",
        tags: ["hokey", "ice-hokey"]
    }
]

let filterArray = [
    condition('category', 'sports'),
    condition('title', 'goal', compareFunctions.in),
    condition('author', 'john'),
    condition('tags', 'hokey', compareFunctions.in),
]

//console.log(filterArray)

let result = dataset.filter(y => {
    let resolved = filterArray.map(x => x(y))
    return resolved.every(x => x === true);
})

console.log(result)