Where do I put code to initialize before custom module initialization in Angular 14?

I'm using ngrx/data 14 and Angular 14. I have built a custom module that I load in my app.module.ts file like so

@NgModule({
  declarations: [
    AppComponent 
  ],
  imports: [
    ...
    AppRoutingModule,
    MyCustomModule,
    ...
  ],
  providers: [
    ...
  ],
  bootstrap: [AppComponent]
})
export class AppModule { }

The custom module is defined this way

export function initialize(appService: AppService){
  console.log("in initialize");
 return () => appService.load();
}
...
@NgModule({
  declarations: [
    ...
  ],
  imports: [
    ...
  ],
  exports: [
    ...
  ],
  providers: [
    {
      provide: APP_INITIALIZER,
      useFactory: initialize,
      deps: [
        AppService
      ],
      multi: true
    },
    ...
  ]
})

export class MyCustomModule { 
  constructor(entityDataService: EntityDataService, myObjectDataService: MyObjectDataService) {
    console.log("called from module");
    entityDataService.registerService('MyObject',  myObjectDataService);
  }
}

The problem is, I notice that the module constructor is run before the "initialize" method (I can see the console.log "called from module" is called before the "in initialize" statement within the "initialize" method. My question is, how or where do I put code that will initialize prior to my module getting instantiated?

I noticed APP_INITIALIZER is not initializing before the module and this is happening after Angular version 14 and 14+.

One workaround for this is to get your initial configuration using fetch API. So whatever data you are fetching from the AppService you can get it using fetch API here.

Then call your platformBrowserDynamic Settings once you receive response from the fetch API.

Try this stackblitz example.

import './polyfills';
export interface AppConfig {
  auth: {
    auth0_audience: string,
    auth0_domain: string,
    auth0_client_id: string,
  };
}

import {
  platformBrowserDynamic
} from '@angular/platform-browser-dynamic';


import {
  AppModule
} from './app/app.module';
import {
  InjectionToken
} from '@angular/core';

const APP_CONFIG: InjectionToken < AppConfig > = new InjectionToken < AppConfig > ('Application Configuration');
// Same as App service
fetch('./config.json')
  .then((res) => res.json())
  .then((config) => {
    console.log("Initialize")
    console.log(config)
    // Save this config in window object to access it across application.
    window['config'] = config;
    platformBrowserDynamic([{
      provide: APP_CONFIG,
      useValue: config
    }, ]).bootstrapModule(AppModule).then(ref => {
      // Ensure Angular destroys itself on hot reloads.

      // Otherwise, log the boot error
    }).catch(err => console.error(err));
  });