编写自定义 ngrx 运算符并返回源可观察类型

Question

我有一个自定义运算符，waitFor我在我的效果中使用它，如下所示：

public effect$: Observable<Action> = createEffect(() => {
    return this.actions$.pipe(
      ofType(myAction),
      waitFor<ReturnType<typeof myAction>>([anotherAction]),
      ...etc
    );
  });

它主要是查看correlationId，直到操作数组被调度后才继续执行。但这不是重点。

正如预期的那样ofType采用源可观察对象并将其用作返回类型，但是我正在努力实现相同的效果。正如您在上面看到的，我ReturnType<typeof myAction>>在我的waitFor方法中使用了以下内容：

export function waitFor<A extends Action>(actionsToWaitFor$: Array<Actions>): OperatorFunction<A, A> {

所以目前如果我这样打电话waitFor：

public effect$: Observable<Action> = createEffect(() => {
    return this.actions$.pipe(
      ofType(myAction),
      waitFor([anotherAction]),
      ...etc
    );
  });

然后它的类型被推断为Action，但我希望这是ReturnType<typeof theSourceObservable>默认的。所以我假设我的方法中需要这样的东西waitFor：

export function waitFor<A extends ReturnType<typeof sourceObservable?!>>(actionsToWaitFor$: Array<Actions>): OperatorFunction<A, A> {

waitFor 看起来像这样：

export function waitFor<A extends Action>(actionsToWaitFor$: Array<Actions>): OperatorFunction<A, A> {
  return (source$) => {
    return source$.pipe(
      switchMap((action: A & { correlationId: string}) => {
        // use zip() to wait for all actions 
        // and when omitting map((action) => action)
        // so the original action is always returned
      })
    );
  };
}

从ofType 源头看，我需要使用Extract

更新

此处显示了StackBlitz 示例

Answer 1

这至少可以编译；我不知道它是否也满足您的需求。

public effect3$: Observable<Action> = createEffect(() => {
  const a:Action[]= []

  return this.actions$.pipe(
    ofType(doSomething),
    this.someCustomOperatorReturningStaticTypes(),
    this.thisWontWork(a),
    tap(({aCustomProperty}) => {
      // The type is inferred
      console.log(aCustomProperty);
    }),
  )
});

private thisWontWork<A extends Action>(actionsToWaitFor$: Action[]): OperatorFunction<A, A> {
  return (source$) => {
    return source$.pipe(
      tap(() => {
        console.log('Should work')
      })
    )
  }
}

我无法在 StackBlitz 中运行它，有什么提示吗？

希望这可以帮助