Use NGRX Signal Store methods to run batch updates

Tomasz Ducin
InstructorTomasz Ducin
Share this video with your friends

Social Share Links

Send Tweet
Published 2 months ago
Updated 2 weeks ago

In this lesson, you’ll learn to use patchState for executing multiple state updates.

The example in this video updates the same filters slice in both updates. But, where this feature really shines is when you need to make updates across several different slices of state!

[00:00] The ngrx patch state function allows us not only to run a single update, but to run multiple updates within a single call. Let's create a clear filters method that we're going to implement in just a while. And let's walk to the employee listing component, and we'll create [00:20] a very simple button, which is going to invoke the method whenever clicked. So let's run the store dot clear filters and here clear filters. So whenever we click the button, the values of the name and salary to salary from should be clear. So let's run the patch state function. [00:40] We run path state and we pause this tour, this tour that all the methods rely on the same one, and we'll be having to callback functions. So the first one is going to over here update the, clear the name filter [01:00] and the same one is going to do a similar job, but clear the salary filter. So the first callback is going to update only the filters slice where we pass that this one is currently.state.filters. So whatever we have [01:20] here and basically that the new name should be empty because we are clearing it simply. And here, it's gonna start very similar way. So filters, which is the destructured state dot filters. So whatever other filters were, and finally, salary. And the [01:39] initial values that we've got is the from, which is 0 and to, which we just decided that is going to be 10,000. So all in all, this is how we can run batch updates using the patch state function. Let's just make sure that everything works here correctly. So let's just put some [01:59] interesting numbers over here and when we click the button everything is cleared. In our case, both of the updates relate to the same slice, so they could be, of course, simplified into just one call. When batch updates really shine is when we want to run one update when we touch different slices.

egghead
egghead
~ 2 minutes ago

Member comments are a way for members to communicate, interact, and ask questions about a lesson.

The instructor or someone from the community might respond to your question Here are a few basic guidelines to commenting on egghead.io

Be on-Topic

Comments are for discussing a lesson. If you're having a general issue with the website functionality, please contact us at support@egghead.io.

Avoid meta-discussion

  • This was great!
  • This was horrible!
  • I didn't like this because it didn't match my skill level.
  • +1 It will likely be deleted as spam.

Code Problems?

Should be accompanied by code! Codesandbox or Stackblitz provide a way to share code and discuss it in context

Details and Context

Vague question? Vague answer. Any details and context you can provide will lure more interesting answers!

Markdown supported.
Become a member to join the discussionEnroll Today