Question

我使用函数＆＃39; valueChanges＆＃39;跟踪活动表单输入字段的更改，当我写任何类似＆＃34; abc＆＃34;工作良好， 但是，当我删除文本时，会引发错误功能，然后当我再次写任何东西时，“值变化”＆＃39;没有开火，这是样本：

this.searchForm.controls.SearchValue.valueChanges
      .debounceTime(1000)
      .switchMap(term => this._http
    .get(CONFIG.API_ENDPOINT + `/folders/search/` + term))
      .subscribe(
        (result) => {
          this.searchResult = result;
        },
        (err) => {
          console.log(error);
        })

我需要知道发生了什么？

Answer 1

Observable以流完成或发生错误后停止发出值的方式工作。

this.searchForm.controls.SearchValue.valueChanges
      .debounceTime(1000)
      .filter(val => val)
      .switchMap(term => {
          return this._http.get(CONFIG.API_ENDPOINT + `/folders/search/` + term)
            .catch(err => {
                console.log(err);
                return Observable.empty()
            })
      })
      .subscribe(result => {
          this.searchResult = result;
      })

您可以在此处播放代码：https://stackblitz.com/edit/angular-http-r1qe3z（输入数字）。该视频非常有用：https://www.youtube.com/watch?v=3LKMwkuK0ZE 26:20是解释的地方。

Answer 2

this.searchForm.controls.SearchValue.valueChanges
      .debounceTime(1000)
      .filter(term => !(term === null || term === ''))
      .switchMap(term => this._http
    .get(CONFIG.API_ENDPOINT + `/folders/search/` + term))
      .subscribe(
        (result) => {
          this.searchResult = result;
        },
        (err) => {
          console.log(error);
        })

反应形式：输入字段的valueChanges引发错误

2 个答案: