AngularJS filter based on an array of strings almost there

Question

I am trying to create a custom angular filter based on an array of strings, for example:

$scope.idArray = ['1195986','1195987','1195988']

The data I want to filter is in the format:

    $scope.data = {
    "moduleName": null,
    "contentholder_0": {
        "moduleName": "contentholder",
        "id": "-1",
        "name": "",
        "content": ""
    },
    "webapps_1": {
        "moduleName": "webapps",
        "items": [{
            "itemid": "1195986",
            "name": "abc"
        },{
            "itemid": "1195987",
            "name": "def"
        },{
            "itemid": "1195988",
            "name": "ghi"
        }]
    }
}

I have looked at this Stack Question to try to create a custom filter: Example

Here is the JSFiddle of the answer

I have not been able to hack it to fit my data structure for what I want to do (filter the "items" if the "itemid" is in the "idArray")

This is a JSfiddle as close as I can get without crashing angular.

Please forgive me if this is a super easy question but I am a beginner and have tried multiple ways to get this to work but haven't been able to. I am not sure where the actual filtering is being done and how to compare the strings in idArray to data.webapps_1.items.itemid

Any help would be greatly appreciated.

Could you describe more what you are trying to do? You have an array of strings - what way would you like to filter them? — adamjld, May 26 '15 at 11:32

score 1 · Accepted Answer · answered May 26 '15 at 11:50

I believe this is what you are trying to do.. This filter now checks to see if any of the items have the same ID as any in the ID array.

.filter('selectedTags', function () {
return function (items, tags) {
    var filtered = [];
    angular.forEach(items, function (item) {
        angular.forEach(tags, function (tag) {
            if (item.itemid == tag) {
                filtered.push(item);
            }
        });
    });
    return filtered;
};
})

See this Fiddle

score 0 · Answer 2 · answered May 26 '15 at 11:37

0

I am not sure if this can help you but I like to use underscore.js to manipulate my JS objects/arrays and there is a function which does exactly that :

_.pluck(data.webapps_1.items, 'itemid');

Based on documentation :

pluck

_.pluck(list, propertyName) A convenient version of what is perhaps the most common use-case for map: extracting a list of property values.
var stooges = [{name: 'moe', age: 40}, {name: 'larry', age: 50}, {name: 'curly', age: 60}];
_.pluck(stooges, 'name');
=> ["moe", "larry", "curly"]

From what I understood of your question, this will generate idArray from data

Then you can create a custom filter which call this code :)

answered May 26 '15 at 11:37

sebastienbarbier

6,542
3
29
55

Thank you but I do not know underscore.js – Gerard Simpson May 26 '15 at 12:06
No problem, you should save time looking at underscore js for some basic manipulation in your projects. Make it easy to read, very popular library so people know how to use it, and it avoid mistakes in some low level code like a wrong loop or something. Just an advice, nothing mandatory of course :D, but good luck. – sebastienbarbier May 26 '15 at 13:05

AngularJS filter based on an array of strings almost there

2 Answers2

pluck