访问主要应用程序数据的角度模块

Question

我在 Ionic 2 和 3 中开发了多个应用程序。它们共享相同的登录服务器，并且由于所有应用程序中的登录代码都相同，因此我拆分为一个独立的 git 存储库。在每个应用程序的app/文件夹中都有一个config.ts文件，其中包含：

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

我将登录模块作为 app.module.ts 中的角度模块包含在内：

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

login.module.ts 是：

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]
}
}
}

问题是模块需要APPNAME和API地址来做登录的事情。整个模块独立于主应用程序，我作为位于 src/providers/login 中的 git 子模块添加到项目中。但是当在像 LoginPage 或 RegisterPage 这样的模块的页面组件中我需要这些常量时，我确实需要：

import { AuthService } from '../auth.service';
import { APPNAME, API } from '../../app/config';
@IonicPage()
@Component({
selector: 'page-login',
templateUrl: 'login.html'
})
export class LoginPage {

这是专门引用主应用程序的唯一代码行。我想通过在主应用程序中通过 forRoot() 传递配置来反转该引用，但我不知道如何在模块的页面组件中检索它。我是否应该以某种方式将它们导入到身份验证服务中，然后通过页面组件中的服务访问？我怎样才能做到这一点？

Answer 1

我终于解决了通过服务传递数据的问题。在 app.module.ts 中添加应用数据：

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

在模块中，将其传递到服务中：

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

在服务中，注入它：

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

编辑：此解决方案在AOT模式下不起作用，您需要导出为工厂函数并在服务中创建一个实例

export function AppConfig() {
return {
APPNAME: APPNAME,
API: API
};
}
constructor(
@Inject('appData') _appData: any
) {
this.config = _appData();