APP_INITIALIZER not resolving promises before continuing to other providers

Issue

I'm struggling to see what I am missing here. Hopefully it's just a small issue.

My problem lies with the APP_INITIALIZER not completely resolving.

I have two services: AppSettingsService and SomethingService. I created a new injectable token "API_BASE_URL" that I want to inject in SomethingService. AppSettingsService has a method called setup() that sets the string "test" in a Promise. I want to finish resolving this promise before continuing on to set API_BASE_URL. However, it doesn't seem to want to wait!

I've attached a sandbox:

Sandbox

Open the console and have a look. It runs as:

"Executing promise" (this is expected) "Getting test string too early" (this I would expect after the promise has resolved) "undefined" (this is because I am printing appSettings.test but it hasn't been set yet because the Promise hasn't completed) "Resolving promise" (this happens shortly after (because of the setTimeout())

Thanks for any help!

Solution

The return statement is missing for all the providers useFactory sections, kindly find below the corrected code!

import { APP_INITIALIZER, NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';

import { AppComponent } from './app.component';
import { AppSettingsService } from './app-settings.service';
import { API_BASE_URL } from './something.service';

@NgModule({
  declarations: [AppComponent],
  imports: [BrowserModule],
  providers: [
    AppSettingsService,
    {
      provide: APP_INITIALIZER,
      multi: true,
      deps: [AppSettingsService],
      useFactory: (appSettingsService: AppSettingsService) => {
        return () => {
          return appSettingsService.setup();
        };
      },
    },
    {
      provide: API_BASE_URL,
      deps: [AppSettingsService],
      useFactory: (appSettingsService: AppSettingsService) => {
        console.log('Getting test string too early');
        console.log(appSettingsService.test);
        return appSettingsService.test;
      },
    },
  ],
  bootstrap: [AppComponent],
})
export class AppModule {}

code sandbox

Answered By - Naren Murali