Hi I was wondering if anyone know how to get a store's current state once without having to subscribe to it. I'm currently using ngrx to subscribe to the store and access its state to set a component's attribute, but since I'm subscribed this attribute is constantly refreshing. So I'm looking for a way to obtain this attribute just once so that I can display data without it refreshing constantly.
Just in case, this happens inside my component's constructor.
I've been trying something like this:
_store.select('storeData.correlationData');
When subscribing I would access like this:
_store.subscribe(
(state) => {
this.correlationData = state.storeData.correlationData;
}
);
EDIT
Applciation State:
export interface ApplicationState {
uiState: UiState;
storeData: StoreData;
}
You can create getState()
function, put it in a shared module and import where needed. The key is to make it synchronous by using take(1)
operator:
export function getState(store: any, selector: string) {
let _state: any;
store.take(1).subscribe(o => _state = o);
return _state;
}
Here's more advanced version I'm using:
export function getState(store: any, selector?: any) {
let _state: any;
let state$: any;
if (typeof selector === 'string' && /\./g.test(selector)) {
state$ = store.pluck(...selector.split('.'));
} else if (typeof selector === 'string') {
state$ = store.map(state => state[selector]);
} else if (typeof selector === 'function') {
state$ = store.map(state => selector(state));
} else {
state$ = store;
}
state$.take(1)
.subscribe(o => _state = o);
return _state;
}
With this you can get state in few different ways:
getState(this.store) // all data in Store
getState(this.store, 'users')
getState(this.store, state => state.users)
getState(this.store, 'users.address.street') // Cool!
As @Maximes pointed out in comments, you should try to use Observables directly in your code and use this method for testing.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With