[ ] Regression (a behavior that used to work and stopped working in a new release)
[ ] Bug report
[ ] Performance issue
[ ] Feature request
[ ] Documentation issue or request
[x] Support request
[ ] Other
Is it possible to use the DI when creating the store class ?
I want to use the akitaPreAddEntity hook with a service inside it provided inside the constructor of the store class.
Nevertheless, since the store class must be created by hand with new, how can I inject the Angular dependencies ?
const initialState = {
active: null
};
@StoreConfig({
name: 'dummy-name'
})
export class DummyStore extends EntityStore<DummyState> {
public constructor(
private dummyLoggerService: DummyLoggerService
) {
super(initialState);
}
public akitaPreAddEntity(newDummy: Dummy): Dummy {
this.dummyLoggerService.debug('this is a dummy log');
return newDummy;
}
}
export const DUMMY_STORE = new DummyStore();
Obviously, the problem here is new DummyStore(); which requires the dummyLoggerService token as argument.
Is there a way to achieve it ?
Thanks !
Angular version: 8.2.8
Why you create the store manually?
Thanks for the reply so soon.
I create the store instance like it was done in the documentation (fresh v2 of akita).
It seems that this is no longer the way to do it from the doc though...
If you are using Akita CLI, you need to set the template to angular. https://github.com/datorama/akita/tree/master/cli#base-path
Well I will made some changes asap.
I see that now the store is provided from the constructor so it should do it, nice work and thanks for asking the real question here.
I do not use the CLI nevertheless I use the ng update command so it could have been a schematics change perhaps ?
I changed the way to create the store instance but I still have a problem.
I used the debugger to check if the constructor received the right tokens and it is.
const initialState = {
active: null
};
@StoreConfig({
name: 'dummy-name'
})
export class DummyStore extends EntityStore<DummyState> {
public constructor(
private dummyLoggerService: DummyLoggerService
) {
super(initialState);
}
public akitaPreAddEntity(newDummy: Dummy): Dummy {
// this is undefined here
this.dummyLoggerService.debug('this is a dummy log');
return newDummy;
}
}
Do you have any why this seems not available inside the hooks ?
Could be something from my implementation but at this point I doubt it.
Thanks.
It's a JS concept. You need to use bind.
this.akitaPreAddEntity = this.akitaPreAddEntity.bind(this)
Thanks again for the fast reply and as a matter of fact, the final solution.
Here is the final working exemple if someone has the same need.
const initialState = {
active: null
};
@StoreConfig({
name: 'dummy-name'
})
export class DummyStore extends EntityStore<DummyState> {
public constructor(
private dummyLoggerService: DummyLoggerService
) {
super(initialState);
this.akitaPreAddEntity = this.akitaPreAddEntity.bind(this);
}
public akitaPreAddEntity(newDummy: Dummy): Dummy {
this.dummyLoggerService.debug('this is a dummy log');
return newDummy;
}
}
@NetanelBasal Would it be possible todo the binding in the base class as using this inside these methods is a very common use case and binding manually seems like boilerplate code that could easily be forgotten?
I would love to see a PR.
My understanding of this part of js is limited so my approach might be a bit naive of just dumping this line into the constructor of the base blass:
this.akitaPreAddEntity = this.akitaPreAddEntity.bind(this);
On the other hand when thinking about how angular handles OnInit etc with no need todo binding it feels like there is a more robust & elegant way to handle these overrides. On the other hand maybe angular does the binding behind the curtains.
Any pointer is welcome.