在ngrx effect angular中做某事之前等待两个序列动作答案

【问题标题】：Wait two sequence actions before do something in ngrx effect angular在ngrx effect angular中做某事之前等待两个序列动作
【发布时间】：2019-06-10 10:34:09
【问题描述】：

我想：创建一本书，然后加载图书列表，然后导航到图书详细信息页面

假设我有 2 个效果：加载列表书和创建书。 loadListBook 效果正常工作（和以前一样）

我的创建效果写对了吗？

create$: Observable<Action> = this.action$.pipe(
  ofType<CreateBook>(BookActions.createBook),
  switchMap(action => {
    return this.bookService.create(action.payload).pipe(
      map(newbook => {
       console.log(newbook)
      }),
      catchError(error => of(  {
        type: 'CREATE_BOOK_FAILURE'
      }))
    );
  }),
  switchMap(bookInfo => [
    new LoadBookList()
  ]),
  tap(book => {
    // want to navigate to book detail here
    console.log(e);
  })
);

【问题讨论】：

标签： angular action sequence dispatch ngrx-effects

【解决方案1】：

看起来是正确的。我建议将其分成较小的特定于动作的效果而不是大的，这样它就更具可读性，并且您避免排队 switchMaps

create$ = createEffect(() => this.actions$.pipe(
  ofType(BookActions.createBook)
  switchMap(action =>  
    return this.bookService.create(action.payload).pipe(
      map(() => BookActions.createBookSuccess(),
      catchError(err => of(BookActions.createBookFail({err}))
    );
  })
));

loadList$ = createEffect(() => this.actions$.pipe(
  ofType(BookActions.createBookSuccess)
  switchMap(() =>  
    return this.bookService.loadList().pipe(
      map(() => BookActions.loadListSuccess(),
      catchError(err => of(BookActions.loadListFail({err}))
    );
  })
));

redirect$ = createEffect(() => this.actions$.pipe(
  ofType(BookActions.loadListSuccess)
  tap(() => this.router.navigate(['book-detail-page']))
));

【讨论】：