ngrx ofType，@ngrx/效果

Question

我试图了解 typeof 效果在 ngrx 的底层是如何工作的， 如果我在我的应用模块中声明：

....

@NgModule({
    imports: [
        EffectsModule.forRoot([TodosEffectsService])
],

....

而且我肯定会写效果文件：

@Effect() createTodos$ = this.actions$
.ofType(CREATE_TASK)
    .map(() => {
        console.log('called');
            return { type: 'OTHER'};
});

@Effect() addTodos$ = this.actions$
.ofType(CREATE_TASK)
    .map(() => {
        console.log('called');
            return { type: 'OTHER'};
});

我试着理解，现在在运行时我调度一个动作 this.action$ 被订阅并且每次都执行 ofType 来匹配类型？ 或 ofType 一次执行！？

如果它调用一次，当我调度动作时，效果如何知道每次女巫效果订阅/执行？

谢谢大家！

Answer 1

您还可以从每个效果中分派一组动作。

Read this article from medium

Answer 2

关键是在ngrx/effects里面的Actions类没有导出ofType 所以你可以像下面这样使用它： 1- 从ngrx/effects 导入ofType

import { Injectable } from "@angular/core";

import { Effect, Actions, ofType } from "@ngrx/effects";
import * as omid from "@ngrx/effects";
import { of } from "rxjs";
import { map, switchMap, catchError } from "rxjs/operators";
@Injectable()
export class PizzasEffects {
  constructor(
    private actions$: Actions,
    private pizzaService: frtomServices.PizzasService
  ) {}

  @Effect()
  LoadPizzas$ = this.actions$.pipe(
    ofType(pizzaActions.LOAD_PIZZAS),
    switchMap(() => {
      return this.pizzaService.getPizzas().pipe(
        map(pizzas => new pizzaActions.LoadPizzasSuccess(pizzas)),
        catchError(error => of(new pizzaActions.LoadPizzasFail(error)))
      );
    })
  );
}

Answer 3

this.actions$ .ofType(CREATE_TASK) 将在每次调度您的操作时调用，在您的减速器案例执行后。 喜欢 减速机

switch(action) {
case youractionsname.CREATE_TASK : {
// pure function logic here
   }
}

如果你有任何类型为“CREATE_TASK”的效果，第一个减速器将执行，然后它会生效。 在订阅模式中，您订阅的任何内容都将是回调函数，它将根据条件存储在引擎盖下的数组中。当您根据条件调度动作时，所有函数都会调用满足条件的人。

Answer 4

简而言之，当.ofType() 被调用时，它订阅动作的源流并将匹配的动作推送到结果流。所以它确实被调用了一次。

如果我们查看source code，我们会看到ofType 使用filter 库的filter 运算符，这意味着this.action$.ofType(CREATE_TASK) 可以扩展为

this.action$.filter(action => action.type === CREATE_TASK)

filter如何工作的描述可以从rxjsdocs找到：

与众所周知的Array.prototype.filter 方法类似，此运算符从源 Observable 获取值，将它们传递给 predicate 函数，并且只发出产生 true 的值。

值得注意的是，您的每个效果都将一个可观察对象 (this.action$) 作为输入，并在初始化效果时返回一个仅订阅一次的新可观察对象。返回的 observable 定义了输入 observable 中的动作如何转换的方式，但它不影响源 observable 本身。

在您的示例中，ofType() 方法返回一个新的 observable，它“侦听”this.action$ observable，并且只发出满足条件 action.type === CREATE_TASK 的操作。然后是 map 运算符，它还返回一个新的 observable，它“侦听”ofType() 调用返回的 observable，并根据您传递的投影函数将接收到的每个操作转换为新值。但是所有这些可观察对象都只创建一次，在初始化时，当您调度操作时，它们只是“流动”通过可观察对象，被过滤和转换。

您可能还想更加熟悉rxjs。我建议您查看 André Staltz 的 "You will learn RxJS" 演讲，它应该让您直观地了解什么是可观察对象以及它们是如何工作的。