ngrx dispatch actions from component or service or separate class

Question

I see a lot of examples of code where the store.dispatch() call happens directly in the Angular component. Isn't it bad to have a dumb Angular Component have access to the entire Store? Why not move all of the action dispatching to Angular Service. Then the Component can selectively choose which service to use.

Or why not put the action definition and functions to dispatch that action all in one action class that can injected into the Component?

Answer 1

I realize it's been well over a year since your post, but I came across your question looking for something similar.

Firstly, you mentioned:

Isn't it bad to have a dumb Angular Component have access to the entire Store?

If you're developing your app using a Smart Component > Dumb/Presentation Component pattern, you would want try to keep services and stores out of your presentation component and interact with your smart/container component via @inputs and @outputs only.

It sounds like you may be describing a Facade pattern which would allow you to abstract the store interaction complexities behind a set of simple class methods. The facade would be injected into your smart component to keep your presentation component pure.