Filter object of object with RxJS

Question

I have the following stream and I would like to filter and keep only the params that are true(boolean).

{
  "colors": {
    "red": "",
    "yellow": true,
    "green": false
  },
  "size": {
    "t5": true,
    "t10": "",
    "t20": true
  }
}

I need the output to look like this:

{
  "colors": ["yellow"],
  "size": ["t5,t20"]
}

Here are my thougt when I try to deal with this:

I tried to use map but without success. I guess it's because it's an object and not an array.
All keys and values are dynamic in this object so I can't use them to manipulate the object.
flatMap() help me a bit but I don't know what to do with it as I don't know the name of the keys.

this.form.valueChanges
  .debounceTime(400)
  .flatMap(x => Object.values(x))
  .subscribe(console.log)

Meir · Accepted Answer · 2016-11-08 10:26:24Z

3

This is not an rxjs issue, just a plain js mapping:

getTruthyKeys(obj: any): Array<string> {
   return Object.keys(obj).filter(key => obj[key] === true);
}

mainKeysToTruthyLists(obj: any): Array<{key: string, truthy: Array<string>}> {
  let result = {};
  Object.keys(obj).forEach(key => result[key] = getTruthyKeys(obj[key]);
  return result;
}

and now you can apply it as a map on your stream:

this.form.valueChanges
  .debounceTime(400)
  .map(mainKeysToTruthyLists)
  .subscribe(console.log)

edited Nov 8, 2016 at 10:26

answered Nov 7, 2016 at 22:29

Meir

14.4k4 gold badges44 silver badges49 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Tom Over a year ago

It worked after I added a return in the mainKeysToTruthyLists function. I also added a join(','). I like your style. This was really helpful. Thank you.

Estus Flask · Accepted Answer · 2016-11-07 22:39:40Z

3

This isn't really a RxJS question. All that RxJS should do here is map. This can be done with Object.entries:

this.form.valueChanges
.debounceTime(400)
.map(obj => {
  return Object.entries(obj)
  .reduce((newObj, [key, subObj]) => {
    const subArr = Object.entries(subObj)
    .filter(([, subValue]) => subValue)
    .map(([subKey]) => subKey);

    return Object.assign(newObj, { [key]: subArr });
  }, {})
})

answered Nov 7, 2016 at 22:39

Estus Flask

226k79 gold badges478 silver badges620 bronze badges

Collectives™ on Stack Overflow

Filter object of object with RxJS

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related