Question

我有一个返回可观察值并调用另一个方法来处理接收到的数据的方法。如果在我的onNext方法中调用this.addNewData（），则它只能像超级按钮一样工作。

data: BaseData[] = [];


initData() {
 this.dataProvider.getData()
.subscribe(this.addNewData());
}

但是，如果我想对接收到的数据做更多事情并使用lambda，则将调用我的方法this.addNewData（），但结果我的数据收集仍然为空。

initData() {
 this.dataProvider.getData()
.subscribe(
          data => {
            this.addNewData();
            this.showProgressSpinner = false;
            console.log(this.data);
          });
    }
}

  private addNewData() {
    const dataIds = this.data.map(i => i.dataId);
    return fetchedData => fetchedData
      .filter(i => ! dataIds.includes(i.dataId))
      .forEach(i => this.data.push(i));
  }

我是Angular的新手，我想了解为什么会发生这种情况。

Answer 1

您知道subscribe()接受可选的三个回调next, error, complete。

第一个回调是next，它需要具有一个接受输入的函数[此输入将是可观察对象发出的值]，并返回void。

现在让我们了解您的addNewData（）函数返回什么-

private addNewData() {
    const dataIds = this.data.map(i => i.dataId);
    return fetchedData => fetchedData
      .filter(i => ! dataIds.includes(i.dataId))
      .forEach(i => this.data.push(i));
  }

它正在返回一个箭头函数，该函数接受输入并返回void。

现在回到您的第一种订阅方式-

initData() {
 this.dataProvider.getData()
.subscribe(this.addNewData());
}

上一个订阅正在填充this.data，因为this.addNewData()返回了next的{{1}}回调和{{1 }}被执行，这是您的以下箭头功能-

subscribe()

现在希望您能明白为什么第一次订阅要填充this.addNewData()

现在进入第二种订阅方式：

fetchedData => fetchedData
      .filter(i => ! dataIds.includes(i.dataId))
      .forEach(i => this.data.push(i));

在上面的订阅中，您已经传递了一个函数（即箭头函数），因此将执行该函数。现在，您无法对this.data的返回函数执行任何操作，并且该函数有责任更新您的集合initData() { this.dataProvider.getData() .subscribe( data => { this.addNewData(); this.showProgressSpinner = false; console.log(this.data); }); } }。您应该执行以下操作使其有效：

this.addNewData()

希望这能回答您的问题。

onNext方法不会在可观察到的位置触发

1 个答案: