2016-06-24 38 views
9

Io uso "angular2 webpack" e "angular2/forma, osservabile", ma ha incontrato un errore, bisogno di aiuto ..angular2 Osservabile Proprietà 'debouceTime' non esiste sul tipo 'osservabile <any>'

C'è un modulo personalizzato validatore -

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

sono riuscito a trovare il file "/projection_direction/node_modules/rxjs/operator/debounceTime.js"

perché c'è ad esempio la error--

Proprietà 'debouceTime' non esiste sul tipo 'Osservabile'.

risposta

26

assicurati di aver avviato che in main.ts (dove è bootstraped l'applicazione)

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

o tutti in una volta

import "rxjs/Rx"; 

EXTEND

lì è 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"); 
    } 
} 

e che sta lavorando, quando in main.ts abbiamo:

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

import "rxjs/Rx"; 

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

Controllare lo here

+0

aggiungo "import" rxjs/add/operator/map "; import "rxjs/add/operator/debounceTime" ora; 'nel main.ts ,, ma l'errore è ancora ... –

+0

Ho creato un plunker per te, esteso la risposta .. spero che dovrebbe aiutare –

+0

@ RadimKöhler Penso che il Plunker sta errore. Personalmente vedo errori TS 'Argomento di tipo '(term: any) => void' non è assegnabile al parametro di tipo '(valore: any, index: number) => ObservableInput <{}>'. Il tipo 'void' non è assegnabile al tipo 'ObservableInput <{}>' .' – BenRacicot

3

Hai un errore di battitura qui. È debounceTime, non debouceTime :)

Problemi correlati