在我的应用程序中,我遇到了与combineLatest
操作员相关的奇怪行为。我通过在线演示重现了这个问题:
注意:请忽略这个demo中的这个业务逻辑,这不是很合理,我只是想在技术层面重现这个问题。
https://stackblitz.com/edit/angular-qcdslo?file=src/app/app.component.ts
private testRequest() {
this.pokemon$ = combineLatest(this.limit$, this.offset$)
.pipe(
map(data => ({limit: data[0], offset: data[1]})),
switchMap(data => this.pokemonService.getPokemon(data.limit, data.offset)),
map((response: {results: Pokemon[]}) => response.results),
);
}
这个方法使用 combineLatest 来组合两个 observables:limit$ 和 offset$。并向 API 发送请求,其中 limit 和 offset 的值只是 API 的参数。
我通过以下方法每 5 秒将计数器值增加 1:
let counter = 1
setInterval(() => {
this.offsetControl.setValue(counter)
counter++;
}, 5000)
最后,由于某种原因,我还需要按以下方式每隔 6 秒调用一次 testRequest 方法:
setInterval(() => {
this.testRequest();
}, 6000)
那么网络请求行为如下:
limit=5&offset=0
limit=5&offset=1
limit=5&offset=0
limit=5&offset=2
limit=5&offset=0
limit=5&offset=3
...
limit=5&offset=0
limit=5&offset=n
我不明白为什么limit=5&offset=0
反复发生。谢谢你。