angularionic-frameworkangular-akitaakita

How to declare a Query/Service in Akita in order to use it in another module


I'm starting to use Akita in my ionic application.

I've a SessionModule, in which I declare a SessionService, SessionQuery, ... But I would like to listen to the SessionQuery in my app.component.ts.

I tried to declare everything in my SessionModule:

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { SessionQuery } from './store/session.query';
import { SessionService } from './store/session.service';



@NgModule({
  declarations: [
    SessionQuery,
    SessionService
  ],
  imports: [
    CommonModule
  ],
  exports:[
    SessionQuery,
    SessionService
  ]
})
export class SessionModule { }

I declared it as import in my app.module.ts

And use it in my App.Component.ts:

 public name$ = this.sessionQuery.selectName$;

  constructor(
    private platform: Platform,
    private splashScreen: SplashScreen,
    private statusBar: StatusBar,
    private sessionQuery: SessionQuery
  ) {
    this.initializeApp();
  }

but when I run it, I get some errors:

Error: Unexpected value 'SessionQuery' declared by the module 'SessionModule'. Please add a @Pipe/@Directive/@Component annotation.
Unexpected value 'SessionService' declared by the module 'SessionModule'. Please add a @Pipe/@Directive/@Component annotation.

What should I do? Is it mandatory to use a query only in the same module where it's declared?


Solution

  • I found the solution:

    In fact, you do not need to import/export anything, BUT, you need to mark service+store+query injectable by placing this before each class declaration:

    @Injectable({
      providedIn: 'root'
    })