For this post, I assume you already have knowledge about ngrx (a reactive state management framework for Angular), and you are working with reducers, actions, effects, and selector components. You can find information in ngrx. Today, I want to show you how to work with state inside of the effect component.
xxxxxxxxxx@Injectable()export class AppEffects { constructor(private actions: Actions, private service: yourService) {} infoEffect = createEffect(() => this.actions.pipe( ofType(getInfoAction), mergeMap(() => this.service.getInfo() .pipe( map(resp => getInfoSuccessfulAction({info: resp,})) ) ) ) );}This is a very simple example of an effect. It’s defined by the getInfoAction action, and there is a call to service getInfo. Then, it’s fired the action, getInfoSuccessfulAction. At this point, everything is straightforward, but what if you need to get some value from @ngrx/store. Well, the good news is you can do it; let me show you how to.
For this post, I assume you already have knowledge about ngrx (a reactive state management framework for Angular), and you are working with reducers, actions, effects, and selector components. You can find information in ngrx. Today, I want to show you how to work with state inside of the effect component.
TypeScript
xxxxxxxxxx
1
18
1
@Injectable()
2
export class AppEffects {
3
4
constructor(private actions: Actions, private service: yourService) {}
5
6
infoEffect =
7
createEffect(() =>
8
this.actions.pipe(
9
ofType(getInfoAction),
10
mergeMap(() =>
11
this.service.getInfo()
12
.pipe(
13
map(resp => getInfoSuccessfulAction({info: resp,}))
14
)
15
)
16
)
17
);
18
}
This is a very simple example of an effect. It’s defined by the getInfoAction action, and there is a call to service getInfo. Then, it’s fired the action, getInfoSuccessfulAction. At this point, everything is straightforward, but what if you need to get some value from @ngrx/store. Well, the good news is you can do it; let me show you how to. […]