angular2 Observable Property 'debouceTime' does not exist on type 'Observable<any>'

Be sure you've initiated that in main.ts (where the app is bootstraped)

import "rxjs/add/operator/map";
import "rxjs/add/operator/debounceTime";
...

or all at once

import "rxjs/Rx";

EXTEND

there is a working example

//our root app component
import {Component, EventEmitter, ChangeDetectorRef} from '@angular/core'
import {Observable} from  "rxjs/Rx";
@Component({
  selector: 'my-app',
  providers: [],
  template: `
    <div>
      <h2>Hello {{name}}</h2>

        <div>debounced message: {{message}}</div>
    </div>
  `, 
  directives: []
})
export class App {

  protected message: string;
  protected emitter = new EventEmitter<string>();
  public obs: Observable<string>;

  constructor() {
    this.name = 'Angular2 (Release Candidate!)'

    this.obs = this.emitter
      .map(x => x)
      .debounceTime(1200)
      ;

    this.obs.subscribe(msg => this.message = msg);
  }

  ngOnInit(){
    this.emitter.emit("hello after debounce");
  }
}

and that is working when in main.ts we have:

//main entry point
import {bootstrap} from '@angular/platform-browser-dynamic';
import {App} from './app';

import "rxjs/Rx"; 

bootstrap(App, [])
  .catch(err => console.error(err));

Check it here


For everyone coming here after rxjs 6:

You now need to use a pipe():

What was

myObservable$
    .debounceTime(500)
    .subscribe(val => {
    // debounced stuff
})

needs now to be:

myObservable$
    .pipe(debounceTime(500))
    .subscribe(val => {
    // debounced stuff
})

https://www.learnrxjs.io/operators/filtering/debouncetime.html


You have a typo here. It's debounceTime, not debouceTime :)