0

我想从外部来源为我的应用程序检索属性

我正在寻找与 java 中 config.properties 相同的原则

配置文件

{
  "myUrl": "http://localhost:8080"
}

应用模块.ts

import {APP_INITIALIZER, NgModule} from '@angular/core';
...

export function initConfig(config: AppConfigService) {
  return () => config.load();
}

@NgModule({
  declarations: [
    AppComponent,
    ...
  ],
  imports: [
    BrowserModule, RouterModule,
    AppRoutingModule,
    FormsModule, TableModule,
    HttpClientModule,
    FlexLayoutModule, FormsModule,
    ReactiveFormsModule,
    BrowserAnimationsModule,
    MatCardModule, MatButtonModule, MatListModule, MatIconModule, MatToolbarModule, MatSidenavModule, MatFormFieldModule,
    MatSelectModule, MatDatepickerModule, MatDatepickerModule, MatExpansionModule, MatInputModule, MatCheckboxModule, MatDialogModule,
    //ColorPickerModule,
    NgxMatColorPickerModule,
  ],
  providers: [DatePipe,
    {
      provide: APP_INITIALIZER,
      useFactory: initConfig,
      deps: [AppConfigService],
      multi: true
    },
    { provide: MAT_COLOR_FORMATS, useValue: NGX_MAT_COLOR_FORMATS },
    {provide: DateAdapter, useClass: AppDateAdapter},
    {provide: MAT_DATE_FORMATS, useValue: APP_DATE_FORMATS}],
  bootstrap: [AppComponent],
})
export class AppModule {
}

应用配置.service.ts

import {Injectable} from "@angular/core";
import {Subject} from "rxjs";
import {HttpClient} from "@angular/common/http";
import {environment} from "../environments/environment";

@Injectable({
  providedIn: 'root'
})
export class AppConfigService {
  private config: Config = null;
  public configSubject: Subject<any> = new Subject<any>();

  constructor(private http: HttpClient) { }

  public load() {
    return this.http.get(environment + 'config.json')
      .toPromise()
      .then((config: any) => {
        this.config = config;
        this.configSubject.next(this.config);
      })
      .catch((err: any) => {
        console.error('ERROR: ' + err);
      })
  }

  getMyUrl() {
    return this.config.myUrl;
  }
}

export class Config {
  myUrl: string;
}

但在浏览器控制台中,我收到 2 个错误:

zone-evergreen.js:2845 GET http://localhost:4200/[object%20Object]config.json
app-config.service.ts:23 ERROR: [object Object]

我曾多次尝试使用预览来查找文件位置的变化,但似乎没有任何效果

//environment.ts
export const environment = {
  production: false
};
//enviroment.prod.ts
export const environment = {
  production: true
};

我的环境文件中只有这个

4

0 回答 0