角度服务减法过滤器

时间:2015-07-01 23:16:44

标签: javascript angularjs

我有一个Angular服务,我尝试使用Javascript的Array.prototype.filter()方法返回过滤后的数据集。我匹配多个输入对象' key value与另一组对象key value对配对,如果匹配则返回该对象。

这是我的服务:

app.service('scatterService', function(inputService) {
    return function(data) {
        var inputs = inputService.selectedInModel(); // returns 1 - 4 user input objects
        function getSelected(inputs) {
            return data.filter(function(obj) {
                // for each user input that exists
                angular.forEach(inputs, function(val, id) {
                    var dataProp = val['inData'];
                    // if prop value in data = prop value in user input
                    if (obj[dataProp] == val['value']) {
                        // returns objects that have *either* of the user inputs
                        return true;
                    }
                    return false;
                });
            });
        }
        var newData = getSelected(inputs);
        console.log(newData);
    };
});

这将返回一组对象,这些对象包含value" a"或value" b",但两者中的一个。我希望这只返回 a和b值的对象。因此,如果有四个理论用户输入,则用户选择的每个输入会越来越多地缩小数据。或者,仅返回具有所有输入值的项目。

我还希望能够在功能上过滤最多4个潜在输入。

编辑:添加对象结构

inputs: {
    'entertainment': {
        id: 'entertainment',
        inData: 'Ent',
        value: '',
    },
    'TV': {
        id: 'TV',
        inData: 'tv',
        value: '17'
    },
    'Radio': {
        id: 'radio',
        inData: 'radio',
        value: 'JackFM'  
    }
},

数据:300多件商品

data = [
    {
        id: '12345',
        Ent: 30,
        tv: 33
    },
    {
        id: 'TV',
        tv: 17,
        Ent: 999
    }
    // ... and so on
]

1 个答案:

答案 0 :(得分:1)

关注Array.prototype.filter部分:

return data.filter(function(obj) {
    // for each user input that exists
    angular.forEach(inputs, function(val, id) {
        var dataProp = val['inData'];
        // if prop value in data = prop value in user input
        if (obj[dataProp] == val['value']) {
            // returns objects that have *either* of the user inputs
            return true;
        }
        return false;
    });
});

当您找到匹配的属性值时,您会立即返回true - 这会导致当任何一个值匹配时,过滤器会选择obj。< / p>

相反,您可以使用布尔 AND 运算符在每个输入上构建结果。当且仅当每个中间输入测试都是true时,结果为true。如果任何一个失败,结果将是false

return data.filter(function(obj) {
    // result tracks if this is a matching obj
    // initially assume that it is
    var result = true;

    // for each user input that exists
    angular.forEach(inputs, function(val, id) {
        var dataProp = val['inData'];
        // AND the current result value with this input's test 
        result = result && obj[dataProp] === val['value'];
    });

    // return the resulting chain of ANDs
    return result;
});