Let Operator in Angular

app.ts

//our root app component
import {Component, NgModule, Output, EventEmitter, Input} from '@angular/core'
import {BrowserModule} from '@angular/platform-browser'
import {ReactiveFormsModule, FormControl} from '@angular/forms';
import {Observable} from 'rxjs/Rx';

@Component({
  selector: 'app-input',
  template: `
    <input type="text" [formControl]="form" class="form-control">
  `,
})
export class AppInput {
  @Output() value = new EventEmitter();
  @Input() middleware: Observable<any> = obs => obs;
  form;
  
  ngOnInit() {
    this.form = new FormControl();
    
    this.form.valueChanges.let(this.middleware).subscribe(val => {
      this.value.next(val);
    });
  }
  
  ngOnDestory() {
    // destroy
  }
  
}

@Component({
  selector: 'my-app',
  template: `
   <app-input (value)="doSomething($event)" [middleware]="middleware"></app-input>

  `,
})
export class App {
  middleware = obs => obs.debounceTime(1000).filter(val => val !== "test");
  constructor() {
     console.clear();
   
  }
  
  doSomething(val) {
    console.log(val);
  }
 
  
}

@NgModule({
  imports: [ BrowserModule, ReactiveFormsModule ],
  declarations: [ App, AppInput ],
  bootstrap: [ App ]
})
export class AppModule {}