ngRx 继承的效果类不工作

Question

我在 mono-repo 中有两个应用程序，一个将是另一个的免费子集，因此免费应用程序中的所有功能都包含在非免费应用程序中。

我正在尝试设置我的效果，以便有一个核心效果 class 实现所有常见效果，然后在非免费项目中扩展它以添加其他效果。这是行不通的。只要是我定义的所有效果，这两个应用程序都可以使用核心效果，但是一旦我向非免费的 class 添加更多效果，它就会停止识别核心效果。

设置如下：

core.effects.ts 包括 CoreEffects class，它定义了 2 个原版效果 - LoadLayout 和 ToggleSidebar
not-free.effects.ts 包含扩展了 CoreEffects class
free.effects.ts 包括扩展 CoreEffects class 的 FreeEffects class 并且不定义任何附加效果。
在我的模块中，我导入了 Effects 模块并指定了 inherited 效果 class：EffectsModule.forRoot([NotFreeEffects]) 和 EffectsModule.forRoot([FreeEffects])。如果我理解正确，这意味着我继承的 classes 设置正确，因为仍然可以看到核心效果（除非我在继承的 class 中定义其他效果）

举个例子，LoadLayout效果是这样的（其他类似）：

@Effect()
  loadLayout$: Observable<Action> = this.actions$
    .ofType(CoreLayoutActions.LOAD_LAYOUT)
    .switchMap(() => this.layoutService.loadLayout())
    .map(
      (layoutState: ICoreLayoutState) =>
        new CoreLayoutActions.LoadLayoutSuccessAction(layoutState)
    );

当我运行使用此设置的任一应用程序时，一切正常。我在 reducer 中添加了日志语句，这样我就可以看到 LoadLayoutSuccess 消息何时在 reducer 中传递和处理。

一旦我向 NotFreeEffect class 添加了另一种效果（即免费应用程序未使用的效果），就不再处理核心效果 - 我在 reducer 中的日志语句不再指示 LoadLayoutSuccess永远被派遣。 除了向 not-free class 添加一个完全不相关的 Effect 之外，没有任何变化。免费的应用程序继续工作，非免费的则不然。如果我从 not-free 中删除那个额外的效果，它会再次开始识别核心效果。

我错过了什么？你应该能够像这样继承效果 classes 吗？

详情：

Angular CLI：1.7.1
节点：8.9.4
OS: win32 x64
Angular：5.2.7 ... 动画、通用、编译器、编译器-cli、核心、表单 ... 语言服务、平台浏览器、平台浏览器动态 ...路由器
@angular/cdk: 5.2.5
@angular/cli: 1.7.1
@angular/material: 5.2.5
@angular-devkit/build-optimizer: 0.3.2
@angular-devkit/core: 0.3.2
@angular-devkit/schematics: 0.3.2
@ngtools/json-schema: 1.2.0
@ngtools/webpack: 1.10.1
@schematics/angular: 0.3.2
@schematics/package-update: 0.3.2
打字稿：2.6.2
webpack: 3.11.0
ngrx: 5.2.0
@nrwl/nx: 1.0.3

Answer 1

Ngrx < 8:

这是一个具有各种症状的已知问题。本质上，在效果的上下文中使用 extends 是有问题的。我的经验是，只要您在子类中没有任何效果，基类中的效果就会起作用。
https://github.com/ngrx/platform/issues/586
https://github.com/ngrx/platform/issues/1234

更新：由于此提交 https://github.com/ngrx/platform/commit/e7ae8a228ee4338b6beac4baf0bba745fa32c917#diff-708a6e5fc1424e81075508aee61cb59f 效果在子类化时根本不再起作用。原因 "hasOwnProperty"-使用而不是直接访问效果元数据-属性.

很遗憾，Ngrx 团队不想改变这种行为
https://github.com/ngrx/platform/pull/890

有关解决方法，请参阅。

Ngx >= 8

现在可以通过使用 createEffect 函数（他们似乎以不同的方式实现了）。另见

Answer 2

abstract class GenericEffects {

 protected constructor(
   protected actions$: Actions,
 ) {}

 protected _someGenericEffect$ = this.actions
  .pipe(
      ofType('GENERIC_ACTION')
      ...
    )
}


class SpecificEffects extends GenericEffects {
    @Effect()
    someSpecificEffect$ = this._someGenericEffect$;
}

Answer 3

NgRx 从 8.0.0-beta.0.

版本开始提供函数 createEffect

要使 NgRx 效果在继承类中工作，只需将装饰效果替换为新的 createEffect 函数，如下面的代码片段所示：

import { createEffect, ofType } from '@ngrx/effects';

loadLayout$ = createEffect(() => this.actions$...);

您可以通过运行安装最新的测试版（您可能还需要将 rxjs 更新为@latest）：

npm install --save @ngrx/store@next @ngrx/effects@next @ngrx/schematics@next @ngrx/store-devtools@next

ngRx 继承的效果类不工作

ngRx inherited Effects classes not working

angular

ngrx

ngrx-effects

Ngrx < 8:

Ngx >= 8

ngRx 继承的效果 类 不工作

ngRx inherited Effects classes not working

angular

ngrx

ngrx-effects

Ngrx < 8:

Ngx >= 8

ngRx 继承的效果类不工作