在请求完成之前调用回调函数

时间:2019-04-21 19:04:04

标签: javascript angular typescript

我有一个类似于twitter中的“喜欢”按钮,该按钮调用了一个处理请求的函数,并在回调函数中增加了“喜欢”次数并将“喜欢的bool”更改为true,并将该按钮更改为“不喜欢”按钮,问题是,如果我在“赞”按钮中快速单击,则“赞”次数的增加和减少的数量要比允许的一个用户多

我尝试将回调函数内部和外部延迟1秒,但效果不佳

likeDecision(kweek: Kweek): void {
    // not in my profile
    if (this.callCommonFunc) {
      this.kweekFunc.like(kweek);
      return;
    }
    // in my profile
    this.kweekService.likeKweek(kweek.id).subscribe(() => {
      this.likeCallBack(kweek);
    });
  }

  likeCallBack(kweek: Kweek): void {
    this.kweeks.forEach(loopKweek => {
      if (loopKweek.id === kweek.id) {
        loopKweek.liked_by_user = true;
        loopKweek.number_of_likes++;
      }
    });
  }

  unlikeDecision(kweek: Kweek): void {
    // not in my profile
    if (this.callCommonFunc) {
      this.kweekFunc.unlike(kweek);
      return;
    }
    // in my profile
    this.kweekService.unlikeKweek(kweek.id).subscribe(() => {
      this.unlikeCallBack(kweek);
    });
  }

  unlikeCallBack(kweek: Kweek): void {
    this.kweeks.forEach(loopKweek => {
      if (loopKweek.id === kweek.id) {
        loopKweek.liked_by_user = false;
        loopKweek.number_of_likes--;
      }
    });
  }

我想以最快的速度单击,并在请求完成时调用回调函数

这是我在其中使用的http请求:

likeKweek(id: string): Observable<any> {
return this.http.post<any>(`${this.base}kweeks/like`, { id: id }).pipe(
  map(res => res),
  catchError(this.handleError)
);
}

1 个答案:

答案 0 :(得分:0)

我认为您可以使用布尔值来检查是否仍在执行最后一个请求。 例如,您可以使用下一个算法。

docker stack deploy...