Angular Modul Zugriff auf Haupt-App-Daten

Question

Ich habe mehrere Anwendungen in Ionic 2 und 3 entwickelt. Sie teilen sich den gleichen Login-Server, und da der Login-Code in allen Apps gleich war, habe ich in ein unabhängiges Git-Repository aufgeteilt. Im app/Ordner jeder App gibt es eine config.ts Datei mit:

export const APPNAME = 'appname'; 
export const API = 'https://api.appname.com'; 

I-Modul als Winkelmodul in app.module.ts Anmeldekennung:

@NgModule({ 
    declarations: [ 
    MainApp 
    ], 
    imports: [ 
    ... 
    LoginModule.forRoot() 
] 

und die Anmeldung. module.ts ist:

import { NgModule, ModuleWithProviders } from '@angular/core'; 
import { CommonModule } from '@angular/common'; 
import { AuthService } from './auth.service'; 

@NgModule({ 
    imports: [CommonModule], 
    providers: [AuthService] 
}) 
export class LoginModule { 
    static forRoot(): ModuleWithProviders { 
     return { 
      ngModule: LoginModule, 
      providers: [AuthService] 
     } 
    } 
} 

Das Problem ist, dass Modul APPNAME und API-Adresse benötigt, um Login-Zeug zu tun. Das gesamte Modul ist unabhängig von der Haupt-App und ich habe es dem Projekt als git Submodul hinzugefügt, das sich in src/providers/login befindet. Aber wenn in Seitenkomponente des Moduls wie Loginpage oder RegisterPage ich diese Konstanten müssen, das tue ich:

import { AuthService } from '../auth.service'; 
import { APPNAME, API } from '../../app/config'; 

@IonicPage() 
@Component({ 
    selector: 'page-login', 
    templateUrl: 'login.html' 
}) 
export class LoginPage { 

Es ist die einzige Zeile Code, die spezifisch Haupt App verweist. Ich möchte diese Referenz umkehren, indem ich config über forRoot() in der Haupt-App übergebe, aber ich weiß nicht, wie ich es innerhalb der Seitenkomponente des Moduls abrufen kann. Sollte ich sie irgendwie in den AuthService importieren, und dann über den Dienst in Seitenkomponenten zugreifen? Wie kann ich das erreichen?

Answer 1

Ich löste schließlich die Weitergabe von Daten durch den Service. In app.module.ts fügen Sie Daten App:

@NgModule({ 
    declarations: [ 
    MainApp 
    ], 
    imports: [ 
    ... 
    LoginModule.forRoot({APPNAME, API}) 
] 

Und in Modul, geben sie in Betrieb:

export class LoginModule { 
    static forRoot(appData: any): ModuleWithProviders { 
     return { 
      ngModule: LoginModule, 
      providers: [AuthService, { provide: 'appData', useValue: appData }] 
     } 
    } 
} 

Im Dienst, Injizieren es:

@Injectable() 
export class AuthService { 

    constructor(
    @Inject('appData') public config 
) { 
    console.log(config) 
    } 
[...] 

EDIT: Diese Lösung funktioniert nicht im AOT-Modus, Sie müssen als Factory-Funktion exportieren und eine Instanz im Service erstellen

export function AppConfig() { 
    return { 
     APPNAME: APPNAME, 
     API: API 
    }; 
} 

constructor(
    @Inject('appData') _appData: any 
) { 
    this.config = _appData();