Example of Selectors

What is the Selector?


The Selector allows us to get information for the State store without having to return the entire store.


Selectors are pure functions in NgRx, similar to Reducers.

NgRx helper functions

NgRx provides two helper functions: createSelector() and createFeatureSelector()

createFeatureSelector() method

The createFeatureSelector() method gets the feature state (the state of a feature module),

createSelector() method

The createSelector() method returns a selection of that State information. As you can see, we can use the first method to get the State of a feature and the second type of Selector to get a slice of data from that first State.

Both of these methods are from the NgRx Selector API. What’s really clever about these two helper functions is that when NgRx sees we’re running a Selector with the same two arguments we used previously to get state data, instead of going off and repeating what NgRx has just done, it just returns the same State as it did before without the round trip to go and get the data. The NgRx Store keeps track of the Selectors that have been used, and if we use one that it knows of, it invokes that Selector again without having to run the same selector code again. This gives us a great performance boost.

Create a free account to view this lesson.

By signing up, you agree to Educative's Terms of Service and Privacy Policy