ngrx

I'm trying to better understand the answer by Maxime to this question . My rep is not high enough to comment on the answer there, so I'll ask a new question here. The part about setting up a normalized state makes sense. Then he goes on to talk about how you would create a selector, this part of his answer is quoted below, and showing his code block. In your logic or view (for example with Angular), you need your nested structure so you can iterate over your array and thus, you don't want to iterate on a string array of IDs. Instead you'd like actualContent: ActualContent[];. For that, you

I have an Angular (2) app with four ngrx actions: START Not processed by the reducer (no state change) ngrx Effect calls an async task and maps to SUCCESS or ERROR SUCCESS Processed by the reducer ngrx Effect maps to ADVANCE ADVANCE Not processed by the reducer ngrx Effect navigates to a different route ERROR Processed by the reducer No Effect The problem is that the Effect that catches ADVANCE seems to run before the reducer that processes SUCCESS Here's the Effects code: @Effect() start$ = this.actions$ .ofType('START') .map(toPayload) .switchMap(input => doAsyncTask(input) .map(result => (

Wondering why one would use NGRX or NGXS for an Angular app instead of constructor injected services to handle component IO? Is it only to ensure that component properties references are never mutated without switching out the entire property value reference or is there more to it? Altnernative to NGRX per the answer I developed: Slice . I believe it does everything NgRx / NgXS does (With the exception of a time machine - but this is easy to implement via delta notifications - already supported). but with zero boilerplate. Here's an article showcasing some of the capabilities: https://medium

I am using ngrx/effects. I want to dispatch different actions based on a foo state in the store. This is how I am doing now: @Effect() foo1$ = this.updates$ .whenAction(Actions.FOO) .filter(obj => !obj.state.product.foo) .map<string>(toPayload) .map(x => ({ type: Actions.BAR1, payload: { x }})); @Effect() foo2$ = this.updates$ .whenAction(Actions.FOO) .filter(obj => obj.state.product.foo) .map<string>(toPayload) .map(x => ({ type: Actions.BAR2, payload: { x }})); Is there a way to use RxJS 5 operators like partition , groupBy , if , case in this post ? I cannot use it correctly now. Having 2

I'm using ngrx store, to maintain application state, normalizr to flatten my data from API calls and Immutable. So far it's been working really well, but I'm getting to some more complex data relationships and I was wondering how to proceed with structuring the store. To simplify things, I have two sets of objects. Sessions, and Invoices. One user logs on and can view his list of Sessions. The state in the store is held in an object ISessions : export interface ISessions extends Map<String, any> { result: List<Number>; entities: { sessions: Map<Number, ISessions>, clients: Map<Number, IClient>

I want to have a simple code path for creating and dispatching HTTP actions. What I would like to do is something like: this.http.request(...) .map((res: Response) => res.json()) .catch((err: any) => err.json()) .map((payload: any) => { type: 'SUCCESS', payload }) .catch((payload: any) => { type: 'FAILURE', payload}) .subscribe((action: Action) => this.store.dispatch(action)); That way both the success and failure responses are converted to JSON and then based upon the success/fail criteria assign the correct reduction type so that the store can be operated on properly. (think user login

I have a simple situation, I have actions Like CreatUser, CreateSuccess, CreateFail. How should I add new object to array and when Create action is dispatched or CreateSuccess ? And how should I do that? export function reducer(state = init, action: Actions): State { switch (action.type) { case ActionsTypes.CREATE: return { ...state, inProgress: true }; case ActionsTypes.CREATE_SUCCESS: return { ...state, users: state.users.push(action.payload), inProgress: false }; case ActionsTypes.CREATE_FAIL: return { ...state, error: action.payload, inProgress: false }; default: return state; } In code