title: Using RxJS combineLatest to filter observables?
body: <p>I'm seeing if I can use <code>combineLatest</code> within an Angular service to remove the <code>activeFiler$</code> switch block (The service should be doing the same thing).  This is the component <a href="https://stackblitz.com/edit/slice-todo-hacking?file=src/app/todos.component.ts" rel="nofollow noreferrer">design right now (stackblitz link)</a> and I'm trying to remove all the properties except for the <code>render$</code> observable:</p>
  
  <pre><code>export class TodosComponent implements OnInit {
    constructor(private ts:TodoService) {}
    render$: Observable&lt;Todo[]&gt;; 
    activeFilter$: Observable&lt;VISIBILITY_FILTER&gt;;
  
  
  ngOnInit() {
    this.render$ = this.ts.selectedTodos$;
    this.activeFilter$ = this.ts.activeFilter$;
  
    this.activeFilter$.subscribe(active=&gt;{
          switch (active) {
      case VISIBILITY_FILTER.SHOW_COMPLETED:
        this.render$ = this.ts.completeTodos$;
        break;
      case VISIBILITY_FILTER.SHOW_ACTIVE:
        this.render$ = this.ts.incompleteTodos$;
        break;
      default:
        this.render$ = this.ts.todos$;
        }
    });
  }
    }
  }
  </code></pre>
  
  <p>As shown I have initialized <code>this.render$</code> to an Observable returned from the <code>todo.service.ts</code> file.  The method looks like this:</p>
  
  <pre><code>  this.selectedTodos$ = 
    combineLatest(this.activeFilter$, this.completeTodos$, this.incompleteTodos$, this.todos$, this.applyFilter);
  
    private applyFilter(filter, completeTodos, incompleteTodos, todos): Todo[] {
      switch (filter) {
        case VISIBILITY_FILTER.SHOW_COMPLETED:
          return completeTodos;
        case VISIBILITY_FILTER.SHOW_ACTIVE:
          return incompleteTodos;
        default:
          return todos;
      }
    }
  </code></pre>
  
  <p>So with all that in place, I think I should be able to remove the <code>this.ts.ostore.observe(ACTIVE_FILTER_KEY).subscribe(active=&gt;{
  </code> block in the todos component, but if I removed that the whole app stops working.  </p>
  
  <p>One strange thing is that if I comment out the <code>$activeFilter</code> subscription, and log this:</p>
  
  <pre><code>  this.render$ = this.ts.selectedTodos$;
    this.render$.subscribe(v=&gt;console.log(v));
  </code></pre>
  
  <p>When I enter more todos, they get logged, but they don't render ... Any ideas?</p>