angular: эффекты ngrx не срабатывают

Я работал над несколькими приложениями Angular, в которых реализован Redux (NgRx). Я не могу понять, в чем проблема моего текущего проекта.

Действия:

export class GetUserFromStorage implements Action {
  readonly type = UserActionTypes.GetUserFromStorage;
}

export class GetUserFromStorageSuccess implements Action {
  readonly type = UserActionTypes.GetUserFromStorageSuccess;
  constructor(public payload: User | null) { }
}

export class GetUserFromStorageFail implements Action {
  readonly type = UserActionTypes.GetUserFromStorageFail;
  constructor(public payload: string) { }
}

Редуктор:

case UserActionTypes.GetUserFromStorageSuccess:
    return {
        ...state,
        user: action.payload,
        error: ''
    };

case UserActionTypes.GetUserFromStorageFail:
    return {
        ...state,
        error: action.payload
    };

Эффекты:

@Effect() getUserFromStorage$:
Observable<userActions.GetUserFromStorageSuccess | userActions.GetUserFromStorageFail>
    = this.actions$.pipe(
        ofType(userActions.UserActionTypes.GetUserFromStorage),
        tap(() => console.log('GETUserToStorage$', )),
        mergeMap((action: userActions.GetUserFromStorage) =>
            this.storageService.getItem(StorageKeys.USER).pipe(
                map((user: User | null) =>
                    new userActions.GetUserFromStorageSuccess(user)),
                catchError((error: string) =>
                    of(new userActions.GetUserFromStorageFail(error)))
                ))
            );

В auth.service.ts я подписываюсь на Магазин и отправляю некоторые Действия.

this.store.dispatch(new userActions.GetUserFromStorage());

this.store.pipe(select(userReducer.getUser)).subscribe(
    (user: User) => {
        console.log('user TEST: ', user);
        this.user = user;
    }
);

У меня установлен ReduxDevTools. Действие GetUserFromStorage запускается, но не запускает эффект getUserFromStorage $. Значение console.logged «user TEST» показывает, что «user» имеет значение «null». Есть идеи, кто-нибудь? Спасибо.


angular ngrx ngrx-effects
person PaxForce    schedule 08.02.2019    source источник

Ответы (1)


arrow_upward
16
arrow_downward

Убедитесь, что вы действительно «активировали» их.

Эффекты инъекционные:

@Injectable()

export class FooEffects {

  @Effect() getUserFromStorage$:
Observable<userActions.GetUserFromStorageSuccess | userActions.GetUserFromStorageFail>
    = this.actions$.pipe(
        ofType(userActions.UserActionTypes.GetUserFromStorage),
        tap(() => console.log('GETUserToStorage$', )),
        mergeMap((action: userActions.GetUserFromStorage) =>
            this.storageService.getItem(StorageKeys.USER).pipe(
                map((user: User | null) =>
                    new userActions.GetUserFromStorageSuccess(user)),
                catchError((error: string) =>
                    of(new userActions.GetUserFromStorageFail(error)))
                ))
            );
}

app.module.ts:

import {EffectsModule} from '@ngrx/effects';

imports: [
  EffectsModule.forRoot([
    FooEffects
  ])
]
person Chrillewoodz    schedule 08.02.2019
comment
если бы вы увидели лицо-ладонь, которой я только что наложил ладонь ... вы бы заплакали ... Большое спасибо! - person PaxForce; 08.02.2019
comment
Был там :-) Рад, что помог! - person Chrillewoodz; 08.02.2019
comment
ответ все еще применим ngrx ^ 8.6.0 и 9. В качестве альтернативы EffectsModule.forFeature() - person Andrew Allen; 04.03.2020