actions-executing
actions-executing copied to clipboard
How to get correct action
Hello. I use this library in some of my project and I really appreciate it! Thank you!
But I have a question for a non-particalar use-case..
I have multiple tables on a single view in my projects.
All tables use the same action for loading data, but with a different parameter (id).
action example:
export class LoadFavoriteListObjects {
static readonly type =
'[Users -> Lists] Load objects in the specified favorite list';
constructor(public favoriteListId: number) {}
}
All tables uses a loading spinner, which is show, while some observable returns no null value.
By the default you would use:
@Select(actionsExecuting([LoadFavoriteListObjects]))
isLoading$!: Observable<any>;
but this code will trigger to appear the spinner in all tables simultaneously, while the data is fetched only in one of them...
How can I select actionExecuting parameter (favoriteListId) to compare. lets say the table knows the id of the list, that the data will be loaded for.
.e.g
@Input()
favoriteListId!: number;
isLoading$!: Observable<any>;
constructor(private store: Store) {}
ngOnInit(): void {
this.isLoading$ = this.store.select(actionsExecuting([LoadFavoriteListObjects]))
// I would like to have something like pipe to compare the action id, with the input id.
.pipe(
filter((action: LoadFavoritesListObjects) => { return action.favoriteListId === this.favoriteListId; })
)
;
}
hi, glad you can use this lib and helps you in your app!
unfortunately this library does not differentiate params on the observed Action
s, so i think you have two options:
- create an action per table, in order to show spinner only in the correspondant table
- or subscribe to the actions stream and apply filtering based on the param e.g.
this.actions$.pipe(
map((actionContext) => {
const actionType = getActionTypeFromInstance(actionContext.action);
if (actionType === [LoadFavoritesListObjects] && actionContext.action.favoriteListId === [x]) {
if (actionContext.status === ActionStatus.Dispatched){
return true;
} else {
return false;
}
}
return false;
}
)