ngrx ofType, @ ngrx / эффекты

Вкратце, когда вызывается .ofType(), он подписывается на исходный поток действий и подталкивает соответствующие действия к результирующему потоку. Так оно и называется однажды.

Если мы посмотрим на исходный код , мы увидим, что под капотом ofType используется оператор filter библиотеки rxjs, что означает, что this.action$.ofType(CREATE_TASK) может быть расширен до

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

Описание того, как работает filter, можно найти в rxjs документах:

Подобно хорошо известному методу Array.prototype.filter, этот оператор принимает значения из исходного Observable, передает их через функцию predicate и выдает только те значения, которые дали true.

Стоит отметить, что каждый из ваших эффектов принимает наблюдаемое (this.action$) в качестве входных данных и возвращает новый наблюдаемый объект, который подписывается только один раз, когда эффекты инициализируются. Этот возвращаемый наблюдаемый определяет способ преобразования действий из входного наблюдаемого, но не влияет на сам исходный наблюдаемый.

В вашем примере метод ofType() возвращает новый наблюдаемый объект, который «слушает» this.action$ наблюдаемый объект и испускает только действия, удовлетворяющие условию action.type === CREATE_TASK. Затем следует оператор map, он также возвращает новый наблюдаемый объект, который «слушает» наблюдаемый объект, возвращаемый вызовом ofType(), и преобразует каждое действие, которое он получает, в новое значение в соответствии с переданной вами функцией проекции. Но все эти наблюдаемые объекты создаются только один раз при инициализации, и когда вы отправляете действия, они просто «проходят» через наблюдаемые объекты, фильтруются и преобразуются.

Вы также можете поближе познакомиться с rxjs. Я бы порекомендовал вам проверить доклад Андре Стальца, "Вы выучите RxJS", он должен дать вам интуитивное представление о том, что такое наблюдаемые и как они работают.

this.actions $ .ofType (CREATE_TASK) будет вызываться каждый раз, когда ваше действие будет отправлено, после выполнения вашего случая редуктора. как Redcucer

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

Сначала выполнится редуктор, а затем он будет действовать, если у вас есть какой-либо эффект, имеющий тип 'CREATE_TASK'. В шаблоне подписки все, что у вас есть, будет функцией обратного вызова и будет храниться в массиве под капотом в зависимости от условия. Когда вы отправляете действие на основе условия, что все функции будут вызывать тех, кто соответствует условию.

Дело в том, что ofType не экспортируется в класс Actions внутри ngrx / effects, поэтому вы можете использовать его следующим образом: 1- импорт ofType из ngrx / effects, который будет

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)))
      );
    })
  );
}

Вы также можете отправить набор действий из каждого эффекта.

Прочтите эту статью из средний