javascript - Angular rxjs去抖动

基本上，我的问题是，当连接速度较慢时，用户可以多次按下保存按钮，并且正在保存多个数据。此问题不会在本地发生，但在暂存时会发生。

尽管我已经设置了this.hasBeenSubmitted = true;当请求完成并且根据条件[禁用]按钮时，用户仍然可以多次单击按钮，并且可以保存多次，这是错误的。

有人说Angular rxjs去抖动可以解决这个问题，有人可以启发我吗？谢谢。根据下面的代码，它将如何帮助解决我的问题。谢谢。

码

save(): void {
    const create = this.requestFormService.createRequestData(this.form, this.respondents)
      .subscribe(
        (results: FeedbackRequest[]) => {
          this.hasBeenSubmitted = true;
        },
        (error) => {
          this.hasBeenSubmitted = false;
          this.handleInvalidFields(error, 'Failed to save the Feedback Request as draft. One or more fields contain invalid values. Input a valid value to proceed.');
          this.messageDialogService.show('Failed to save the Feedback Request as draft. One or more fields contain invalid values. Input a valid value to proceed.', true);
          create.unsubscribe();
        }
      );
  }

html

<button [disabled]="hasBeenSubmitted"
            mat-raised-button *ngIf="form" (click)="save()" type="submit">
            <ng-container>
              <span>SAVE</span>
            </ng-container>
          </button>

最佳答案

此时，您在请求完成后设置hasBeenSubmitted。但是由于请求可能需要一些时间，因此用户可以在此期间再次按下按钮。您可以在保存数据之前设置标志：

save(): void {
    this.hasBeenSubmitted = true;
    const create = this.requestFormService.createRequestData(this.form, this.respondents)
      .subscribe(
        res => {},
        (error) => {
          this.hasBeenSubmitted = false;
          this.handleInvalidFields(error, 'Failed to save the Feedback Request as draft. One or more fields contain invalid values. Input a valid value to proceed.');
          this.messageDialogService.show('Failed to save the Feedback Request as draft. One or more fields contain invalid values. Input a valid value to proceed.', true);
          create.unsubscribe();
        }
      );
  }

关于javascript - Angular rxjs去抖动，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/61558322/