Question

我试图制作Ngrx效果来加载来自多个用户的帖子。我已经有一个工作效果加载一个用户的帖子。如何将LoadUsersPosts效果拆分为多个LoadUserPosts效果？

这就是我现在正在尝试的。

 @Effect() loadUsersPosts$ = this.actions$
.ofType(LOAD_USERS_POSTS)
.mergeMap((action: LoadUsersPosts) => {
  const array = [];
  action.payload.forEach(user => {
    array.push(new LoadPosts(user));
  });
  return array;
});

我在forEach中放了一些console.log，但它似乎并没有被执行。

Answer 1

听起来您要执行的基本任务是转换并从可观察流中的数组中单独发出值。您可以像现在一样进行转换，但map比forEach更简单。然后，您只需使用from从结果数组中创建一个observable，它将按顺序发出每个值。这是一个简化的运行示例：

Rx.Observable.of([1,2,3,4,5])
  .mergeMap(x => {
    const transformed = x.map(y => y * 2);
    return Rx.Observable.from(transformed);
  })
  .subscribe(x => { console.log(x); });

<script src="https://cdnjs.cloudflare.com/ajax/libs/rxjs/5.5.10/Rx.min.js"></script>

Answer 2

这可以通过以下代码实现

@Effect()
  loadUsersPosts$ = this.actions$
    .ofType(LOAD_USERS_POSTS)
    .pipe(
      switchMap((action: LoadUsersPosts) => from(action.payload)),
      map(user => new LoadPosts(user))
    );

这里的switchMap运算符会根据＆＃34; action.payload＆＃34;将外部observable转换为多个内部observable。数组使用＆＃34;来自＆＃34;可观察的创作者

＆＃34;从＆＃34;可观察创建者将通过一次发出一个值从数组创建可观察流

地图运算符会将其转换为动作

switchMap运算符比mergeMap更受欢迎。 mergeMap将为所有请求提供输出，而switchMap将取消除最新请求之外的所有请求

Ngrx在项目的多个动作中分割项目的动作

2 个答案: