javascript - RangeError最大调用堆栈超出了 Angular 6

我正在做购物车应用程序，当用户从清单中取消选择项目时，我需要从总额中减去，并且每次用户通过共享服务添加或删除时，我都使用行为主体来更新总额。从总额减去负数后，我再次相应地更新Subject值。但是在这里我得到错误堆栈超出。

onItemDeSelect(uncheckedItem) {
    this.eachItem.itemExtraOptionPrice.prices.forEach(item => {
      this.shared.updateAmountValue.subscribe(value => {
        if (item.id === uncheckedItem.id) {
          this.totalAmount = value - item.amount;
          this.shared.updatedAmount(this.totalAmount);
        }
      });
    });
}

updateAmountValue: BehaviorSubject<number> = new BehaviorSubject(0);

  updatedAmount(value) {
    this.updateAmountValue.next(value);
  }

这里onItemDeSelect（）函数每次在取消选择项时执行，然后更新共享服务中的总量。我不知道我在哪里做错。

最佳答案

当函数进行无限递归时，最大调用堆栈超出错误将大部分出现。在编码中这不是很明显，您已经订阅了可以再次更新值的东西。在您的代码中，您正在做

this.shared.updatedAmount(this.totalAmount);

这将更新值并触发行为主体一个偶数

updateAmountValue: BehaviorSubject<number> = new BehaviorSubject(0);

并且您已经订阅了该主题，该主题将再次更新值，依此类推，将导致无限递归状态。

可能的解决方案

您可以直接获得主题的价值，而不用订阅它。

onItemDeSelect(uncheckedItem) {
    this.eachItem.itemExtraOptionPrice.prices.forEach(item => {
      let value = this.updateAmountValue.getValue();
        if (item.id === uncheckedItem.id) {
          this.totalAmount = value - item.amount;
          this.shared.updatedAmount(this.totalAmount);
        }
    });
}

这不会导致任何递归条件。希望这可以帮助。