Question

我正在使用Angular2制作SPA的前端，我有一个包含大量记录的数据库，数据库本身非常慢，因此占用10000条记录（或者只有最后10条记录使用ORDER BY）占用到4-5秒。在我的情况下，升级数据库不是一种选择。

所以我想要做的是：当用户多次点击paginator的“next”按钮（已经调用onNextClick）时（假设他不断点击最多100次或更多次），只有第一个http请求会被发送到Server / API。现在是我无法理解的部分：

当第一个请求返回结果时，那么最后一次单击的事件会触发一个新请求，忽略第一个和最后一个之间的所有其他点击请求（忽略应该是请求，而不是点击本身）。那么，如果用户仍在点击，则最后一次点击/请求成为第一个，依此类推......

我试图用RxJS做到这一点，但我只是设法通过使用interval来做到这一点，所以如果interval是600 ms并且用户每1000ms点击一次，所有请求都会发送到服务器。这是我的代码：

 private clickStream = new Subject();

 ngOnInit() {
   this.clickStream
   .debounce(() => Observable.interval(600).take(1))
   .subscribe(
     params => {
       this.callHttpPostMethod();
     }
   );
 }

 onNextClick(event) {
     this.clickStream.next(event);
 }

任何Angular2解决方案都是受欢迎的 - 使用RxJS不是必需的。

Answer 1

您可以取消正在进行的请求，并确保使用switchMap仅处理最新请求：

this.clickStream
    .debounceTime(500)
    .switchMap(e=> this.callHttpPostMethod())
    .subscribe(t=> {
          ... do something ...
     });

如何仅在第一个http请求完成时触发新的http请求，并忽略/取消其间的所有其他请求

1 个答案: