Questions tagged [ngrx]

NgRx is a reactive state management library for Angular based on flux design pattern.

NgRx provides a set of reactive libraries for Angular.

It includes:

Store: RxJS powered state management for Angular applications, inspired by Redux

Effects: RxJS powered side effect model for @ngrx/store

Entity: Entity State adapter for managing record collections.

Router-Store: Bindings to connect the Angular Router with @ngrx/store

Store-DevTools: Developer Tools for @ngrx/store

DB: RxJS powered IndexedDB for Angular apps


See Official Docs for more Info

4430 questions
41
votes
5 answers

Navigation ID is not equal to the current router navigation id error

I'm using @ngrx/router-store in my Angularv5 app and I recently started running into a an error: Navigation ID X is not equal to the current navigation id Y (where X and Y are integers). This problem happens consistently when I navigate to route A…
John
  • 9,249
  • 5
  • 44
  • 76
41
votes
4 answers

What is store.select in ngrx

I'm new to Redux and started with ngrx. I'm unable to understand the meaning of this line of code store.select: clock: Observable; this.clock = store.select('clock');
blackHawk
  • 6,047
  • 13
  • 57
  • 100
40
votes
8 answers

ngrx: how to pass parameters to selector inside createSelector method

I have a very simple state in my store: const state = { records: [1,2,3], }; I have a selector for records: export const getRecords = createSelector(getState, (state: State) => state.records)); And what I want now is to have separate selectors…
user3429127
  • 809
  • 1
  • 8
  • 13
38
votes
3 answers

Difference in performance between ngrx and ngxs?

I want to use ngxs for state management in my Angular 6 application. But I am not sure if it is mature for big projects. I can not find any articles about Difference in performance between ngrx and ngxs. Can someone provide some info about…
John Doe
  • 3,794
  • 9
  • 40
  • 72
38
votes
5 answers

ngrx Load data from server only if the store is empty

I have a static set of data, a list of countries, that are used on some components. This data is loaded upon the ngOnInit() of these components but I'd like to load them only if it's the very first time that I request the data (the store is empty).…
gabric
  • 1,865
  • 2
  • 21
  • 32
37
votes
4 answers

How to perform multiple related operations/effects/actions with ngrx/effects

I am working on an application that is using ngrx/store 1.5 along with thunk middleware and I am attempting to move to ngrx/store 2.0 and ngrx/effects. I have a couple questions with regards to how to handle multiple related actions and/or…
cmatthews.dickson
  • 687
  • 2
  • 8
  • 17
32
votes
4 answers

How to wait for 2 Actions in @ngrx/effects

Can effect wait two actions like Promise.all? Example: @Effect() pulic addUser() { return this.actions$.ofType(user.ADD) .switchMap(() => { return this.userService.add(); }) .map(() => { return new…
E. Efimov
  • 443
  • 1
  • 5
  • 10
32
votes
8 answers

How to dispatch an empty action?

I am using ngrx/effects. How can I dispatch an empty action? This is how I am doing now: @Effect() foo$ = this.actions$ .ofType(Actions.FOO) .withLatestFrom(this.store, (action, state) => ({ action, state })) .map(({ action, state }) =>…
Hongbo Miao
  • 45,290
  • 60
  • 174
  • 267
31
votes
3 answers

what is ngrx createSelector and createFeatureSelector?

I have been reading the code of ngrx example app and find two function calls createFeatureSelector('auth'); and createSelector(selectAuthState,(state: AuthState) => state.status); What does this do? export const selectAuthState =…
Karty
  • 1,329
  • 6
  • 21
  • 32
31
votes
1 answer

Why must must ngrx / redux effects return actions? Is using a noop action like elm considered bad practice?

I'm using a redux-style state management design with Angular and ngrx/store and ngrx/effects. Whenever I don't return an action from an effect, I get an error: Cannot read property 'type' of undefined I researched the issue and found that in an…
Eeks33
  • 2,245
  • 1
  • 14
  • 17
30
votes
3 answers

Ngrx 6.1.0 - Select is deprecated - What is the new syntax?

The following ngrx select is deprecated. this.store.select(state => state.academy.academy).subscribe((academy) => { this.academy = academy; }); I found this at store.d.ts @deprecated from 6.1.0. Use the pipeable `select` operator…
Michalis
  • 6,686
  • 13
  • 52
  • 78
30
votes
2 answers

How to use other Angular2 service inside an ngrx/Store reducer?

New to both ngrx/Store and reducer. Basically, I have this reducer: import {StoreData, INITIAL_STORE_DATA} from "../store-data"; import {Action} from "@ngrx/store"; import { USER_THREADS_LOADED_ACTION, UserThreadsLoadedAction,…
Hugh Hou
  • 2,344
  • 5
  • 31
  • 55
29
votes
1 answer

Angular 2, ngrx/store, RxJS and tree-like data

I've been trying to figure out a way to use the select operator in combination with rxjs's other operators to query a tree data structure (normalized in the store to a flat list) in such a way that it preserves referential integrity for…
Jimit
  • 765
  • 2
  • 10
  • 18
29
votes
3 answers

Angular 2: Difference between service and redux

What is the need of redux because we can also save and get data from services, as far as I understand we can also get and save data into services and those services could be used by other components.
blackHawk
  • 6,047
  • 13
  • 57
  • 100
28
votes
2 answers

NgRx - Order of execution of Reducers and Effects

I have an Angular 8 app which uses NgRx 8.3.0 For one of the actions, I need the reducers to execute before the effects, because the effect depends on the reduced state. Does NgRx guarantee that order, or is there a way to force that order?
James Taylor
  • 413
  • 4
  • 6