typescript - Inițializarea Angular Router cu date dintr-un fișier de setări extern


Dezvolt o aplicație și nu sunt sigur unde va fi implementată. Trebuie să pot avea rutele aplicației prefixate dinamic pe baza prefixului dintr-un fișier de setări extern.

Lucrăm într-un mediu de testare unde este implementat într-o sub-locație. Totuși, atunci când încercăm să navigăm la hostname/sublocation, toate rutele eșuează deoarece încearcă să folosească locația rădăcină (care nu este disponibilă pentru noi).

Am proiectat un fișier app.config.json cu o setare location_prefix și am creat un serviciu care este încărcat folosind APP_INITIALIZER în app.module. Totuși, returnează o eroare spunând că Cannot read property 'location_prefix' of undefined.

De asemenea, am verificat configurația serverului și am confirmat că este configurat corect.

config-loader.json

/** Loader for configuration file values */
@Injectable()
export class ConfigLoader {

    /** Application configuration */
    static configuration: ConfigFile;

    /** Initializes a new instance of the {@link ConfigLoader} class */
    constructor(private httpClient: HttpClient) { }

    load() {
        const configUrl = 'app.config.json';

        return new Promise<void>((resolve, reject) => {
            this.httpClient.get(configUrl).toPromise().then((config: ConfigFile) => {
                ConfigLoader.configuration = config;
                resolve();
            }).catch(reason => {
                reject(`Unable to load settings file '${configUrl}': ${JSON.stringify(reason)}`);
            });
        });
    }
}

app.module.ts:

@NgModule({
  declarations: [...],
  imports: [
    AppRoutingModule,
    ...
  ],
  providers: [
    ConfigLoader,
    {
      provide: APP_INITIALIZER,
      useFactory: (configLoader: ConfigLoader) => configLoader.load(),
      deps: [ConfigLoader], multi: true
    }
  ],
  bootstrap: [AppComponent]
})
export class AppModule { }

modul.rutare.aplicație

const prefix = ConfigLoader.configuration.location_prefix;
const routes: Routes = [
  { path: prefix, redirectTo: `${prefix}landing-page`, pathMatch: 'full' },
  { path: `${prefix}landing-page`, component: LandingPageComponent }
];

@NgModule({
      imports: [RouterModule.forRoot(routes)],
      exports: [RouterModule]
    })
export class AppRoutingModule {
}

Mă aștept să pot naviga la hostname/sublocation și să văd ruta principală. Din nou, primesc o eroare deoarece ConfigLoader.configuration nu este populat înainte ca Router-ul să fie configurat.