Ngrx Effects 不听动作

Question

我想在我的 angular 应用程序 (v7) 中使用 ngrx/efffects 和 ngrx/store。我按照 ngrx documentation 中的建议在我的应用程序中配置了所有内容。在 AppComponent 中调度操作时，reducer 正在按预期工作，但看起来 effects 没有监听任何操作.

测试：

执行 ng serve -o 后检查控制台。一切都按预期记录，除了影响中的那个。

请指出我哪里出错了。

Github Repo

效果

@Injectable()
export class AppEffects {
  constructor(
    private actions$: Actions,
    private myService: MyserviceService
  ) {}

  myAction$ = this.actions$.pipe(
    ofType<fromActions.GetItems>(MyActionTypes.GET_ITEMS),
    switchMap(action => {
      console.log('i am in effects', action);
      return this.myService.getItems().pipe(
        map(data => new fromActions.GetItemsSuccess(data)),
        catchError(err => of(new fromActions.GetItemsSuccess(err)))
      );
    })
  );
}

在 AppModule 中配置的效果

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    HttpClientModule,
    StoreModule.forRoot(reducers, { metaReducers }),
    EffectsModule.forRoot([AppEffects])
  ],
})

AppComponent 中的调度操作

export class AppComponent implements OnInit {
  constructor(private store: Store<State>) {
    console.log('in component');
  }

  ngOnInit() {
    console.log('dispatched action in AppComponent');
    this.store.dispatch(new fromAction.GetItems());
  }
}

Answer 1

您缺少 @Effect() 装饰器，没有它，这些可观察对象将不会注册为商店的副作用。

import { Effect, Actions, ofType } from '@ngrx/effects';

//....

@Injectable()
export class AppEffects {
 //  ....

  @Effect()
  myAction$ = this.actions$.pipe(
    ofType<fromActions.GetItems>(MyActionTypes.GET_ITEMS),
    switchMap(action => {
      console.log('i am in effects', action);
      return this.myService.getItems().pipe(
        map(data => new fromActions.GetItemsSuccess(data)),
        catchError(err => of(new fromActions.GetItemsSuccess(err)))
      );
    })
  );
}

Ngrx Effects 不听动作

Ngrx Effects not listening to actions

angular

ngrx

ngrx-effects