Search code examples
angularngrxngrx-storengrx-effects

NGRX 8 Effect fires indefinitely


I'm new to NGRX. I tried to create a simple test action with an effect that just prints 123 to the console, but when I open my browser I see that this effect fires indefinitely (it prints 123 again and again).

Here's my code (yes, I put all my logic into one file, it's just for testing purposes):

import {Component, Injectable, OnInit} from '@angular/core';
import {createAction, createReducer, on, Store} from '@ngrx/store';
import {Actions, createEffect, ofType} from '@ngrx/effects';
import {tap} from 'rxjs/operators';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})
export class AppComponent implements OnInit {

  constructor(private store: Store<AppState>) {
  }

  ngOnInit() {
    this.store.dispatch(test());
  }

}

interface AppState {

}

const test = createAction('[Test] Test');

export const reducer = createReducer(
  {},
  on(test, state => state)
);

@Injectable()
export class Effects {

  test$ = createEffect(() => this.actions$.pipe(
    ofType(test),
    tap(() => console.log(123))
  ));

  constructor(private actions$: Actions) {
  }

}

What I did wrong?


Solution

  • You need to add this piece: { dispatch: false } as of now you are just logging.

    Check the docs here.