我正在关注Angular 2应用程序中的一些Rx.Observable教程,并使用AutoComplete风格的系统。
当我在字段中键入内容时,将从Angular 2 FormControl中触发valueChanges事件。
这被链接到Observable,后者针对JSON端点发出HTTP请求。
端点返回404状态后,valueChanges事件停止工作。
我可以在我的Subscribe方法中看到错误,但是并不确定要恢复并继续运行的最佳技术是什么。
我也有些困惑,为什么KeyUp或ValueChange事件将停止触发。
样本值更改-可观察的链
this.userNameControl
.valueChanges
.do(r => {
// As soon as a 404 status is thrown from getGitHuybUser$, all value change (keyup) events stop working
console.log
}
)
.switchMap(userName => {
return this.getGitHubUser$(userName);
})
.catch(err => {
return Observable.of(err)
})
.subscribe(v => {
console.log(v);
},
(err) => {
// As soon ass there is a 404 status, I end up here
console.log(err);
},
() => {
console.log('Complete');
});
getGitHubUser$(username) {
return this.http
.get(`https://api.github.com/users/${username}`)
}
HTML表单控件
<input type="text" [value]="userName" [formControl]="userNameControl" />
我尝试在捕获中返回Observable.empty()和Observable.never()
.catch(err => {
// Observable.of(err)
// return Observable.empty();
return Observable.never();
})
结果是
subscribe
方法调用了我的complete
方法,并且仍然如此,因此valueChanges仍然不会触发。 最佳答案
弄清楚我的问题,我卡在.catch()
上的.switchMap()
确实需要卡在this.getGitHubUser$(userName)
上
this.userNameControl
.valueChanges
.do(r => {
// As soon as a 404 status is thrown from getGitHuybUser$, all value change (keyup) events stop working
console.log(r);
}
)
.switchMap(userName => {
console.log('GET GIT HUB USER');
return this.getGitHubUser$(userName)
.catch(err => {
console.log('CATCH INNER');
console.log(err);
return Observable.of(err)
})
})
// .catch(err => {
// // THIS CODE IS NOT NEEDED
// console.log('CATCH');
// console.log(err);
// return Observable.never(); // Observable.of(err)
// })
.subscribe(v => {
console.log('SUCCESS');
console.log(v);
},
(err) => {
console.log('ERROR');
console.log(err);
},
() => {
console.log('COMPLETE');
});
关于javascript - 一旦Rx中发生错误,ValueChanges就会停止工作。,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/41272692/