反应形式:输入字段的 valueChanges 引发错误
Reactive forms: valueChanges on input field raises error
我正在使用函数 'valueChanges' 跟踪反应式表单的输入字段的变化,当我写任何类似 "abc" 的东西时都可以正常工作,
但是当我删除文本时,会引发错误函数,然后当我再次写入任何东西时 'valueChanges' 不会触发,这是示例:
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);
})
我需要知道发生了什么事?
Observables 的工作方式是,一旦完成或发生错误,流就会停止发射值。
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 是解释的地方。
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' 跟踪反应式表单的输入字段的变化,当我写任何类似 "abc" 的东西时都可以正常工作, 但是当我删除文本时,会引发错误函数,然后当我再次写入任何东西时 'valueChanges' 不会触发,这是示例:
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);
})
我需要知道发生了什么事?
Observables 的工作方式是,一旦完成或发生错误,流就会停止发射值。
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 是解释的地方。
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);
})