首页 > 解决方案 > Angular 10 - 在订阅中调度 NGXS 动作导致无限循环

问题描述

我在订阅中使用 store.dispatch() 函数调用 NGXS 操作。在调用 store.dispatch() 函数之前,我需要来自订阅的 observable 的数据,因此我不得不等待 observable 传递数据。我不知道如何修复此代码,以防止循环。你们中有人知道如何正确处理吗?

@Select(NepoState.anlagen) myObserveable$: Observable<Anlage[]>;
ngOnInit(): void {
      this.myObserveable$.subscribe((data) => {
        this.store.dispatch(new ChangeAvalableFilterAction(data); // <-- this causes the loop 
      })
}

标签: angularobservableinfinite-loopngxs

解决方案


您从内部调度subscribe正在更改状态并再次触发选择器。这将调度另一个动作,你有一个循环。

您可以执行以下操作:

ngOnInit(): void {
  this.myObserveable$
    .pipe(
      take(1) // either take just one emission, or using first()
      //filter(data => /* or filter according to some condition */)
    )
    .subscribe((data) => {
      this.store.dispatch(new ChangeAvalableFilterAction(data);
  })
}

推荐阅读