Angular filter observable by map keys

Question

I have an observable categories that gets a list of all categories from an api with url and name

{url: "http://test.com/1", name: "test1"}
{url: "http://test.com/2", name: "test2"}

and I have a list of selectedkeywords with a name and a category (with url and name). I made a new map because i need to reorder them by category so I have a list of keywords that belong to a category like this:

this.keywordsSelected$ = this.keywords$.map((keywords) => {
  return keywords.reduce((acc, keyword) => {
    if (!acc.has(keyword.category.url)) {
      acc.set(keyword.category.url, []);
    }
    acc.get(keyword.category.url).push(keyword);
    return acc;

  }, new Map<string, Keyword[]>());
});

So I get a map with an url as key and the keywords in the array:

Map(2) {"http://test.com/2" => Array(5)}

The first list categories has a specific order I need to retain. Thats why i want to filter that list by the second list so i show only the categories that are in the 'selecetedkeywords' list. Something like this:

categories.filter(cat => cat.url === selectedkeyword.key

I am a bit new with reactive programming so obviously I am missing something but maybe someone can give me a push in the right direction ?

Can you be more specific? extend your question a bit more about relation between categories and selectedkeywords :). — Patryk Brejdak
Can you make a simple example that show what you don't understand? It seems like combineLatest, withLatestFrom or forkJoin could be what you're looking for. — martin
I have edited my question a bit so I hope it's more clear what i want to do. — Marjan Bos

Marjan Bos Marjan Bos · Accepted Answer · 2017-12-19T10:25:09

I found the solution with the suggestion from @martin to use combinelatest:

 const key$ = this.keywordsSelected$.switchMap(keys => Observable.from(keys));


const testing = Observable.combineLatest(this.categories$, key$)
  .map(([category, keyword]) => {
    return category.filter(cat => (cat as any).url === keyword[0]);
  });'

Angular filter observable by map keys

1 Answers