angular2 Propriété Observable 'debouceTime" n'existe pas sur le type " Observables<aucun>'

- Je utiliser "angular2 webpack" et "angular2/forme,Observables" , mais a rencontré une erreur ,besoin d'aide ..

Il y a une coutume validateur de formulaire --

import {Observable} from 'rxjs/Rx';
import {REACTIVE_FORM_DIRECTIVES,FormControl, FormGroup, Validators} from '@angular/forms';

emailShouldBeUnique(control:FormControl) {
    return new Observable((obs:any)=> {
      control.valueChanges
        .debouceTime(400)
        .distinctUntilChanged()
        .flatMap(term=>return !this.userQuery.emailExist(term))
        .subscribe(res=> {
            if (!res) {obs.next(null)}
            else {obs.next({'emailExist': true}); }; }
        )});}

Que j'ai pu trouver le fichier "/projection_direction/node_modules/rxjs/operator/debounceTime.js"

pourquoi il y a l'erreur, la

Propriété "debouceTime" n'existe pas sur le type 'Observables'.

OriginalL'auteur Kery Hu | 2016-06-24

  1. 42

    Être sûr que vous avez entrepris que dans la principale.ts (où l'application est bootstraped)

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

    ou tous à la fois

    import "rxjs/Rx";

    ÉTENDRE

    il est un exemple de travail

    //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");
  }
}

    et qui est au travail quand en main.ts nous avons:

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

import "rxjs/Rx"; 

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

    Vérifier ici

    - je ajouter import "rxjs/add/operator/map"; import "rxjs/add/operator/debounceTime" now ; dans la main.ts, mais l'erreur est toujours...
    J'ai créé un plunker pour vous, étendue de la réponse .. espérons que cela devrait aider
    Je pense que le Plunker est erroring. Personnellement, je vois TS les erreurs Argument of type '(term: any) => void' is not assignable to parameter of type '(value: any, index: number) => ObservableInput<{}>'. Type 'void' is not assignable to type 'ObservableInput<{}>'.

    OriginalL'auteur Radim Köhler

  2. 19

    Pour tout le monde de venir ici après rxjs 6:

    Vous devez utiliser un pipe():

    Ce qui a été

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

    doit maintenant être:

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

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

    C'est la réponse correcte.

    OriginalL'auteur user3249027

  3. 4

    Vous avez une faute de frappe ici. C'est debounceTime, pas debouceTime 🙂

    OriginalL'auteur Can Nguyen

  4. 3

    J'ai récemment eu une erreur similaire, tout en travaillant avec angulaire v5.2.6 et rxjs v5.5.6 sur un angulaires-cli 1.6.8 généré projet. J'ai d'abord eu:

    import { debounceTime, map } from 'rxjs/operators;

    depuis que j'ai l'abonnement pour un contrôle valueChanges de l'événement et j'ai gardé l'obtention de l'erreur jusqu'à ce que j'ai mis

    import { Observable } from 'rxjs/Rx';

    J'espère que cela aide!

    OriginalL'auteur GeorgeAnagnostopoulos

  5. 2

    Pour moi, la réponse a été à l'aide de la pipe: 

    .pipe(debounceTime(500))

    Plus de changer l'importation à partir de:

    import "rxjs/add/operator/debounceTime";

    :

    import {debounceTime} from 'rxjs/internal/operators';

    Et oui, j'étais en suivant un tutoriel, donc j'espère que cela aide

    OriginalL'auteur DHLopez

  6. 0

    J'ai eu le même problème récemment, et résolu après que j'ai fait:

    import { debounceTime } from 'rxjs/operators';

    Et a également ajouté pipe comme il est nécessaire je pense Angulaire 5+

    something.pipe(debounceTime(100)).subscribe(something...);

    OriginalL'auteur Aman