Angular 6 ngrx store action от функции, прослушиваемой другим компонентом редуктора - PullRequest
0 голосов
/ 12 октября 2018

У меня есть две функции, заказы и предметы.Внутри функции заказов у ​​меня есть компонент, который отправляет действие.

В двух словах это выглядит так:

constructor(store: Store<OrdersStateContract>) {

    this.orders_subs = store.pipe(select('orders')).subscribe( (orders) => {
      this.orders = orders.orders;
    });

    this.store = store;
}

ngOnInit() : void {
    this.store.dispatch( new LoadOrders({}) );
}

И я понял, что когда я отправляю действие LoadOrders, его ловятПо элементам функции редуктора.Это обычное поведение?или что-то не так?

orders.module.ts :

@NgModule({
  declarations: [
],
imports : [
    MaterialModule,
    BrowserModule,
    StoreModule.forFeature('orders', OrdersReducer),
    EffectsModule.forFeature([OrdersEffects]),
],
providers : [
    OrderService
]
})

items.module.ts :

@NgModule({
  declarations: [
    /*not important*/
  ],
  imports : [
    MaterialModule,
    BrowserModule,
    StoreModule.forFeature('items', ItemsReducer),
    EffectsModule.forFeature([ItemsEffects])
  ]
})

items.reducer.ts

export const ItemsReducer = (state: ItemsStateContract = initialState,
                             action: ItemActions) => {


    switch (action.type) {
        case ItemActionTypes.ItemsFromOrderLoadSuccess:
            return adapter.addAll(action.payload.items, state);

        default:
            return state;

    }
};

orders.reducer.ts

export const OrdersReducer = (state: OrdersStateContract = initialState,
                              action: OrderActions) => {

  switch (action.type) {

    case OrderActionTypes.LoadOrders: {
      return adapter.addAll(action.payload.orders, state);
    }

    default: {
      return state;
    }
  }
};

1 Ответ

0 голосов
/ 12 октября 2018

TL; DR;Это нормальное поведение.

Это так просто: каждое отправленное действие на любом уровне может быть отслежено любым эффектом и любым редуктором.(только эффект или редуктор может решить что-то с ним сделать или проигнорировать)

В эффектах вы можете использовать пользовательский оператор rxjs ofType в ngrx.(в основном это фильтр по типу действия).

В редукторах вы можете проверить тип действия и изменить состояние для необходимых действий.

...