1

我正在实现 concatMap 运算符。甚至在此之前，我尝试一个接一个地进行两个订阅，并且成功了。第一次订阅是针对表单的输入字段进行的，第二次订阅是针对 http 请求的。下面是代码：

// AfterViewInit implementation
// this.form is a formGroup with formControl city

  ngAfterViewInit() {
    this.form.valueChanges.pipe(
      map (val=>val.city),
    ).subscribe(
      val => {this.request(val)}
    );
  }


   request(city){
    this.httpClient.get(url, {params:{
    ...
    }}).subscribe(
      value => {

      }, error => {}
    );
  }

每次更新输入字段时，上面的代码片段都会进行 http 调用。我通过添加 concatMap 对 ngAfterViewInit 进行了如下修改：

  ngAfterViewInit() {
    this.form.valueChanges.pipe(
      concatMap(val=> this.request(val.city)),
    ).subscribe();
  }

现在，请求没有按预期发出。当输入改变时，第一次请求只进行一次。永远不会为更新的输入字段发出第二个请求。我在这里做错了什么？

4

1 回答 1

1

尝试像这样修复请求功能：

request(city){
    return this.httpClient.get(url, {params:{
    ...
    }}).pipe(tap(
      value => {

      }, error => {}
    ));
  }

通过此修复，所有链中将只有一个subscribe调用，并且操作员将按预期工作。

于 2021-12-18T23:09:41.160 回答