Angular 最近一次单击使用排气图而不是第一次进行处理

我正在尝试仅对第一次单击发出请求，并在第一次请求仍在进行时忽略所有其他后续单击。为此，我使用了排气图操作符。但它似乎像switchMap一样工作，因为所有初始请求都被取消，只有最新的请求得到处理

这是密码

const headers = new HttpHeaders({ Accept: "application/json" });
    return this.http
      .post(`${this.sUrl}/token`, null, {
        headers: headers,
      })
      .pipe(
        catchError(this.handleError),
        exhaustMap((token: any) => {
          oRequest.token = token.token;
          headers.append("Content-Type", "application/json");
          return this.http
            .post(`${this.sUrl}/find`, oRequest, { headers: headers })
            .pipe(catchError(this.handleError));
        })
      );

---

我做错了什么？

我用假API做了一个例子：

从“@angular/core”导入{Component}；
从“rxjs/operators”导入{mergeMap，defaustmap}；
从“@angular/common/http”导入{HttpClient}；
从“rxjs”导入{Subject}；
@组成部分({
选择器：“我的应用程序”，
模板：`
提交
`,
样式URL:[“/app.component.css”]
})
导出类AppComponent{
提交$：主题=新主题（）；
构造函数（私有http:HttpClient）{}
恩戈尼尼特（）{
这个。提交$
.烟斗(
mergeMap（（）=>this.http.get(`https://swapi.dev/api/films/1/`)),
排气图（胶片=>
this.http.get（film[“characters”][0]。替换（“http”，“https”））
)
)
.订阅（res=>{
控制台日志（res）；
});
}
onSubmit（）{
此选项。提交$.next（true）；
}
}

---

您单击“提交”，exhaustMap（）操作符将忽略所有正在进行的单击事件，直到HttpClient实例返回响应并完成。

看起来您每次单击都在创建相同的链。如果要使用

defaustmap

，只需订阅一个链，并使用主题将事件推送到该链。

import { Component } from "@angular/core";

import { mergeMap, exhaustMap } from "rxjs/operators";
import { HttpClient } from "@angular/common/http";
import { Subject } from "rxjs";

@Component({
  selector: "my-app",
  template: `
    <button (click)="onSubmit()">submit</button>
  `,
  styleUrls: ["./app.component.css"]
})
export class AppComponent {
  submit$: Subject<boolean> = new Subject();
  constructor(private http: HttpClient) {}
  ngOnInit() {
    this.submit$
      .pipe(
        mergeMap(() => this.http.get(`https://swapi.dev/api/films/1/`)),
        exhaustMap(film =>
          this.http.get(film["characters"][0].replace("http", "https"))
        )
      )
      .subscribe(res => {
        console.log(res);
      });
  }
  onSubmit() {
    this.submit$.next(true);
  }
}