Rxjs using Observable.from() string and prevent Observable being created many times

Question

I have the following function that I'm trying to prevent Observable from being created every time this function is called. Basically, this function is called every time the user types something in the search field. I know I can create Observable from the event as Observable.fromEvent('button', click) but it would require me make tons of changes to the app. Any help is appreciated.

function search(input) { 
  Observable.from([input])
  .map(value => value)
  .filter(value => value.length >3)
  .debounceTime(300)
  .distinctUntilChanged()
  .switchMap(searchValue => { 
    //ajax call 
    return Promise.resolve(data) 
  }) 
  .subscribe(data => {
    //Do something with the data
  })
}

Answer 1

If you want to use observables, but don't want to create one from an event, you can create a Subject and can call its next method from within your search :

import { Subject } from 'rxjs/Subject';
import 'rxjs/add/operator/filter';
import 'rxjs/add/operator/debounceTime';
import 'rxjs/add/operator/distinctUntilChanged';
import 'rxjs/add/operator/switchMap';

var searchSubject = new Subject();
  .filter(value => value.length > 3)
  .debounceTime(300)
  .distinctUntilChanged()
  .switchMap(searchValue => { 
    // ajax call
    return Promise.resolve(data) 
  }) 
  .subscribe(data => {
    // Do something with the data
  });

function search(input) { 
  searchSubject.next(input);
}