选择器NGRX内的调度动作

时间:2019-09-13 13:44:22

标签: angular typescript redux rxjs ngrx

在选择器中,我正在检查存储中的数据是否已加载并与路由器参数相对应。路由器是“真理之源”,因此,如果未加载数据,我想发送一个操作来获取它。可以在选择器中执行此类操作吗?

  (currentGameState, router): Game => {
     if (currentGameState.game.id === router.state.params.gameId && 
         currentGameState.isLoaded) {
         return currentGameState.game;
     }
  }

1 个答案:

答案 0 :(得分:1)

副作用是由效果类处理的(调度动作,调用api等)。

选择器仅用于通过异步从存储中获取数据。这意味着在这里不会像分派操作那样产生任何副作用。

正常情况下,您需要在ngOnInit中初始化数据加载

export class PostComponent implements OnInit {
  public posts$: Observable<IPost[]>;
  constructor(private store: Store<IPostManagementState>) {}
  ngOnInit(): void {
    this.store.dispatch(new GetAllPosts());
    this.posts$ = this.store.pipe(select(selectPostList));
  }
}

然后在视图中使用异步管道

<div *ngFor="let post of posts$ | async">{{ post.body }}</div>

您可以查看代码here