可观察的添加延迟 - 角2

我正在实施注册页面。我想检查用户名是否已经存在。我试图实现asyncvalidator，但每次用户输入一个字符时都会调用服务器，您是否可以在下面的代码中帮助添加一些延迟，以便在用户停止键入一段时间后仅以用户名称调用服务器？我读了一些可观察的debounceTime，但无法使其工作。可观察的添加延迟 - 角2

usernameAsyncValidator(control: FormControl): Observable<any> { 
    return new Observable((obs: any) => { 
    return this.http.get('http://localhost:3000/exists?name='+control.value) 
     .debounceTime(400)      <<-----------THIS IS NOT WORKING 
     .distinctUntilChanged()     <<-----------THIS IS NOT WORKING 
     .subscribe(
     data => { 
      if (data.status === 200) { 
      obs.next({'userNameTaken': true}); 
      } else { 
      obs.next(null); 
      } 
      obs.complete(); 
     }, 
     () => { 
      obs.next(null); 
      obs.complete(); 
     }); 
    }); 
}

请让我知道，如果我可以更好地解释。

- 感谢

来源

2016-08-23 Ankush

这里是一个使用角度团队debounceTime的示例https://angular.io/docs/ts/latest/guide/server-communication.html#!#more-observables希望这可以帮助 –

你把debounceTime放在错误的observable上。目前它正在发送HTTP请求，然后以400毫秒为响应进行响应（这实际上没有做任何事情）。你真正想要的是在debounceTime的字段本身上有一个valueChanged观察值，然后在该订阅期间调用API。没有看到你的其他代码很难确切地知道在哪里把它，但类似：

this.myForm.find("userName") //<-- returns your FormControl of interest 
     .valueChanges //<-- Observable of whenever the value of that control changes 
     .debounceTime(500) //<-- won't send updates until no more events have fired for however many ms 
     .filter((value: string) => value != null && value.length > 0) 
     .subscribe((value: string) => this.checkUserName(value)); //<-- call to your username API here

希望这有助于。

来源

2016-08-23 17:05:12 batesiiic

使用get方法代替find。因为角4没有找到方法 –

可观察的添加延迟 - 角2

回答

相关问题