Question

// component.html
<button (click)="reRoute(1)">Select</button>

// component.ts
reRoute(id: any) {
  this.store.select(fromStore.getBasketEntities).subscribe(data => {
     const url = id + '_' + Object.keys(data).length; // contruct new url
     this.store.dispatch(new fromStore.AddItem(id)); // EDIT: add item to store

     // this.router.navigate(['quote/details/' + url], {
     //   queryParams: { type: 'product' }
     // });
  });
}

我有上述内容，导致控制台进入无限循环，依次输出url中的1_0，然后输出1_1，1_2，依此类推。只需单击一下按钮，即可将多个商品添加到我的商店中。

我要尝试的是在每次点击时添加一个商品，但每次都获取我商店中的商品数量。最初为0，然后将其附加到商店中的商品。第一项的索引为1_0。下次单击该按钮时，将添加另一个索引为1_1的项目，依此类推。

任何帮助，不胜感激。接缝如此直截了当，但这使我忙了几个小时……

编辑：我将url更改为id。发生同样的问题。我想在点击后立即路由到添加的项目-因此，对于第一个添加的项目，路由将为/details/1_0/。这样，此路线便具有从商店中检索商品并显示其详细信息的逻辑。

我只是想添加一下，以完整了解我要实现的目标。谢谢

EDIT_2：：我将dispatch移到了订阅之外，这解决了该商品继续添加到商店的问题，但是每次单击{先单击{1}}，然后单击4_0。我现在想知道如何处理4_1

router.navigation

Answer 1

您正在使用预订状态的一部分

this.store.select(fromStore.getBasketEntities)

这意味着每当购物篮实体发生更改时，subscribe中的函数就会被执行。我假设AddItem操作确实会修改商店的这一部分，这意味着它将重新触发select，依此类推。

您仅应在以AddItem作为有效载荷的click事件中调度id操作。在化简函数中，您可以计算url。

reRoute(id: any) {
  this.store.dispatch(new fromStore.AddItem(id));
}

添加到ngrx存储时出现rxjs无限循环

1 个答案: