I am using Akita as a state store for my Angular application.
I am successfully fetching data from a backend server and populating my store (data is displayed in components) but when I try to update an entity in the store it emits an empty object.
I suspect this something fundamental to my understanding of Akita I'm missing, but I expected calling the following would
- update the entity with given ID
- trigger myQuery.select(id).subscribe() with the updated entity
myStore.setActive(idOfThingToUpdate)
myStore.updateActive({someProperty: newPropertyValue})
myStore.removeActive(idOfThingToUpdate)
I have also tried this syntax in the service:
this.myStore.update(entityId, {propertyName: newPropertyValue});
The subscribe function shown above is returning an empty object. If I create a constructor in my entity class and set a couple of defaults, only those properties defined in the constructor are returned in the query.select() call. And the values of those properties are defaults (defined in constructor) not values that would have existed in the store.
So it seems one or both of the following is true:
- entity in the store is not getting updated
- akita is returning a newly constructed entity rather than what I expect (the updated one from the store)
Hope that all makes sense....
Some code:
Service:
this.contestStore.setActive(contestId);
// attempt set a single property 'winningLicence' on the active entity
this.contestStore.updateActive({
winningLicence: newWinningLicence
}
);
this.contestStore.removeActive(contestId);
Am I meant to pass a newly constructed entity into the updateActive() function or just the props I want updated?
export interface ContestState {
loading: boolean;
contests: Contest[];
}
export function createInitialState(): ContestState {
return {
loading: false,
contests: []
};
}
@StoreConfig({ name: 'contestStore', resettable: true})
export class ContestStore extends EntityStore<ContestState> {
constructor() {
super(createInitialState());
}
}
Query - this does return meaningful data when I call selectAll in a component:
@Injectable()
export class ContestsQuery extends QueryEntity<ContestState> {
constructor(protected contestStore: ContestStore) {
super(contestStore);
}
}
From component...
ngOnInit(): void {
// contest is @Input and may be a new unsaved/no id contest, hence check
if (this.contest.id) {
this.contestsQuery.selectEntity(this.contest.id).subscribe((contest: Contest) => {
// this comes back as empty object after calling my update code in service shown above
console.log(contest);
});
}
}