angular - Angular2 RC4 debounceTime still calls on every keystroke -

i have validation directive checks see if client key unique. seems work expected until check network traffic , see making call every keystroke.

import { directive, forwardref, reflectiveinjector } '@angular/core'; import { abstractcontrol } '@angular/common'; import { formcontrol, ng_validators } '@angular/forms';  import {observable} 'rxjs/rx';  import {domainservice} '../services/domain.service';  interface irefidvalidator { }  function validaterefidfactory(domainservice : domainservice) {   return (control: abstractcontrol): observable<irefidvalidator> => {      // domain id , ref id key      let domainid: number = +control.root.find('domainid').value;     let clientid: number = +control.root.find('clientid').value;     let key: string = control.value;      // return observable null if     // reference id check comes successful     return new observable((obs: any) => {       control         .valuechanges         .debouncetime(500)         .distinctuntilchanged()         .flatmap(value => domainservice.checkdomainclientkey(domainid, clientid, key))         .subscribe(         data => {           obs.next(null);           obs.complete();         },         error => {           obs.next({ refid: true });           obs.complete();         }         );     });   }; }  @directive({   selector: '[validaterefid][formcontrolname],[validaterefid][ngmodel],[validaterefid][formcontrol]',   providers: [     domainservice,      { provide: ng_validators, useexisting: forwardref(() => refidvalidatordirective), multi: true }   ] }) export class refidvalidatordirective {   validator: function;    constructor(     private domainservice: domainservice     ) {       console.log('refidvalidatordirective created');     this.validator = validaterefidfactory(this.domainservice);   }    validate(c: abstractcontrol) {     return this.validator(c);   } } 

i using validation directive in model driven form:

 this.domainform = this.fb.group({       clientkey: ['', validators.required, new refidvalidatordirective(this.domainservice).validator]     }); 

as can see, isn't efficient either passing domainservice parent component validation directive, however, have been unable figure out how service injected directive other way.

here network trace looks like, though typing fast:

24?key=test 24?key=testa 24?key=testab 24?key=testabc 

any appreciated.

there's problem in code: aren't returning observable, instead subscription because subscribing , returning.

to it, it's better create s subject debounce each keystroke. here's practice can adapt needs. onsearch method called each keystroke:

import { component, oninit, ondestroy } '@angular/core'; import { subscription } 'rxjs/subscription';  @component({...}) export class examplecomponent implements oninit, ondestroy {  private searchtermstream = new subject<string>();  private searchsubscription: subscription;    ngoninit() {     this.searchsubscription = this.createinputsubscriber();   }    ngondestroy() {     this.searchtermstream.complete();   }    onsearch(query: string): void {     this.searchtermstream.next(query);   }    private createinputsubscriber(): subscription {     return this.searchtermstream       .distinctuntilchanged()       .debouncetime(500)       .subscribe((query: string) => console.log(query));   } } 

here clean memory in ngondestroy method when component destroyed.