how to load objects to cache correctly using APP_INITIALIZER in angular 5?

Question

I have developed a service which load objects on start up but these object are not available in cache.

setupApp function above the NgModule

 export function setupApp(setup: AppLoadService ) {
     return () => setup.initliaze();
 }

@NgModule({
    imports: [

NgModule

 providers: [
        AppLoadService ,
        { 
            provide: APP_INITIALIZER,
            useFactory: setupApp,
            deps: [AppLoadService ],
            multi: true
         },

The AppLoadService ...

@Injectable()
export class AppLoadService  {

  private url = ...

  public countries: Country[]  = [];

  constructor(private http: HttpClient) {}

  public initliaze() {
    this.initCountries();
  }

  public initCountries() {
    if (this.countries.length == 0) {
      this.http.get<Country[]>(`${this.url}`)
      .subscribe(data => { this.countries = data; },
          err => console.error(err),
          () => console.log('done load countries')
      )
    }
  }

  public getCountries() {
    console.log(this.countries)
    return this.countries;
  }
}

When calling the getCountries() method it return empty array. I need the AppLoadService to be a cache service, any idea how to achieve this ?

UPDATE I've changed the initliaze function to this and now it's look like the cache is working:

 initliaze(): Promise<any> {
    return new Promise((resolve, reject) => {
          console.log(`initializeApp:: inside promise`);
          this.initCountries();
          setTimeout(() => {
            console.log(`initializeApp:: inside setTimeout`);
            // doing something

            resolve();
          }, 3000);
        });
  }

Have you looked into using an rxjs subject for your cache objects? — Daniel W Strimpel, Apr 08 '18 at 04:24
Can you also add seupApp function? I noticed initialize method in your AppLoadService doesn't return promise — yurzui, Apr 08 '18 at 04:56
Now I see that you don't return `Promise`. Moreover, you don't return anything — yurzui, Apr 08 '18 at 05:03
No, don't use setTimeout here. I linked the answer that does exactly what you need to do — yurzui, Apr 08 '18 at 05:12
I'll have a look in the linked question and follow from there cause currently the cache doesn't work. — user2304483, Apr 08 '18 at 07:18
The linked answer make things works! But, the loadConfigurationData return only one type of entity, I have many which required to be in the cache (application scope lists). Any idea how to achieve this, maybe to return dummy promise after finishing all the initialization ? can I get example maybe for 2 or more entities? — user2304483, Apr 08 '18 at 10:49

how to load objects to cache correctly using APP_INITIALIZER in angular 5?

0 Answers0