Аварийное приложение Ngrx Effects - PullRequest
Новая
       44

Аварийное приложение Ngrx Effects

0 голосов
/ 19 сентября 2018

Я пишу класс эффектов, один из многих, но в этом случае, поскольку у меня нет бэкэнда для этого конкретного случая, я копирую данные.Дело в том, что этот эффект приводит к сбою моего приложения, когда на экране появляется пустой экран, а после сообщения о том, что приложение слишком долго реагирует, поэтому лучше его закрыть.

Также devtools застревает в действии редукторов обновления,и ничего не отправляет.Если я удаляю класс эффектов из объявления, все идет хорошо и действия отправляются.

Из того, что я вижу в коде, у меня нет ничего необычного, я немного схожу с ума от этогоздесь.

Кто-нибудь знает, что это за проблема? 

import { Injectable } from '@angular/core';
import { Store } from '@ngrx/store';
import * as loadingActions from '../../../../main/actions/loading.actions';
import * as fromMain from '../../../../main/main.reducers.index';
import { Effect, ofType, Actions } from '@ngrx/effects';
import { ConfigureActions, ConfigurationActionTypes, GetProductDetailsSuccess } from '../../actions/configure.actions';
import { tap, mergeMap } from 'rxjs/operators';
import { ProductModelUIFactory } from '../../models/configure.model';

@Injectable()
export class ConfigureProductEffects {
    @Effect() public getProductDetails$ = this.actions$
     .pipe(
         ofType<ConfigureActions>(ConfigurationActionTypes.GetProductDetails),
         tap(() => this.mainStore$.dispatch(new loadingActions.ShowLoading())),
         mergeMap( (action) => {
            const productNumber = action.payload;
            const productDetails = ProductModelUIFactory.build();
            const newaction = new GetProductDetailsSuccess(productDetails);
            return [
                newaction
            ];
        })
    );

    @Effect({ dispatch: false })
    @Effect() public getProductDetailsSuccess$ = this.actions$
    .pipe(
        ofType<ConfigureActions>(ConfigurationActionTypes.GetProductDetailsSuccess),
        tap(() => this.mainStore$.dispatch(new loadingActions.HideLoading())),
    );

    constructor(
        private actions$: Actions,
        private mainStore$: Store<fromMain.MainState>,
    ) {}
}

1 Ответ

0 голосов
/ 19 сентября 2018

Проблема в том, что у вас есть два @Effect() декоратора в 

@Effect({ dispatch: false })
@Effect() public getProductDetailsSuccess$ = this.actions$
.pipe(
    ofType<ConfigureActions>(ConfigurationActionTypes.GetProductDetailsSuccess),
    tap(() => this.mainStore$.dispatch(new loadingActions.HideLoading())),
);

Я думаю, вы застряли в бесконечном цикле из-за второго декоратора.Измените это на следующее, и оно должно работать. 

@Effect({ dispatch: false })
public getProductDetailsSuccess$ = this.actions$
.pipe(
    ofType<ConfigureActions>(ConfigurationActionTypes.GetProductDetailsSuccess),
    tap(() => this.mainStore$.dispatch(new loadingActions.HideLoading())),
);

На дополнительном примечании, почему вы вызываете диспетчеризацию вручную, это может быть переписано как: 

@Effect()
public getProductDetailsSuccess$ = this.actions$
.pipe(
    ofType<ConfigureActions>(ConfigurationActionTypes.GetProductDetailsSuccess),
    map(() => new loadingActions.HideLoading()),
);
...